Learn/UPSIDE

1 - 기본 개발 환경 셋업

Nithen 2025. 2. 5. 22:20
728x90

Overview

 

DApp은 어떻게 만들 수 있을까요?

OverviewDApp은 기존 Web 2.0의 중앙 집중식 구조에서 벗어나, 블록체인 기반의 탈중앙화된 방식으로 동작하는 애플리케이션을 의미합니다. 본 포스트에서는 이론과 개념보다는, '그래서 어떻게 만

spems.tistory.com

이전 시간에는 DApp을 만드는 간단한 과정에 대해 살펴보았습니다. 이번 시간에는 개발을 위한 최소한의 개발 환경 설치 과정을 다룹니다. 개발을 처음 시작하는 이들을 위한 가이드인 만큼, 하나부터 열까지 모두 모른다고 가정하고 진행하겠습니다. 


개발 환경 셋업

이 가이드는 기본적으로 MacOS를 사용하는 유저를 대상으로 기획되었으며 Homebrew로 대부분의 설치를 진행합니다. 따라서, Linux 사용자는 Homebrew-on-Linux를 통해 설치하면 되고, Windows 사용자는 WSL2을 통해 일반 Linux 사용자와 동일하게 설치하시면 됩니다. 아래 링크를 참조하세요!

 

Windows WSL2로 Homebrew 사용하기

MacOS 사용자를 위한 패키지 매니저 Homebrew를 Windows WSL 환경을 통해 간접적으로 설치하고 이용해봅시다.

velog.io

 

1. Git

우리가 간직하고 싶은 순간을 사진으로 남기면 훗날 돌이켜보며 회상할 수 있는 것처럼, 개발 중에 의미있는 시점을 기록해두면 언제든 돌아갈 수 있어 유용합니다. 이러한 작업을 형상 관리 또는 Version Control로 지칭하는데, 이러한 작업을 수행하는데 Git은 전세계가 애용하는 소프트웨어입니다.

  1.  ⌘ + ␣ (cmd + space) 를 눌러 spotlight 검색을 활성화합니다.
  2.  terminal 을 입력하고 실행합니다.
  3.  git -h  git이 설치되어 있는지 확인합니다.
  4. 도움말이 활성화되지 않는다면,  brew install git 으로 설치합니다.

git -h

최초 설정

다음 링크를 참조하여 사용자 정보와 사용할 편집기를 설정합니다. 명령어 형식은 다음과 같아요.

git config --global user.name "John Doe"
git config --global user.email johndoe@example.com
git config --global core.editor emacs

 

 git config --list 명령을 실행하면 설정 내용을 모두 확인할 수 있어요. 다른 설정들도 많지만 우선 무시하셔도 됩니다.

git config --list

2. GitHub

GitHub는 Git 저장소 호스팅 서비스인데, 쉽게 말하면 Git 프로젝트 전용 구글 드라이브라 생각하면 됩니다. 우리 컴퓨터의 용량을 절약하고, 다른 이들과의 프로젝트 협업을 원활하게 만들어주죠. 개인 이메일을 통해 가입하면 됩니다.

 

여러분들의 빠른 시작을 위해 제가 템플릿을 만들었으니, 이걸 복사해서 사용할 계획입니다. 보통 git clone 명령을 사용하는데, 우리는 나중에는 각자 만든 DApp을 GitHub Pages를 통해 배포할테니 독립적인 레포를 만들 수 있도록 이번에는 fork 할 예정입니다.

  1.  brew install gh
    CLI를 통해 작업할 수 있도록 gh 패키지를 설치합시다. 
  2.  gh auth login 아래 첫 번째 이미지처럼 선택하고, 열린 브라우저 창에 터미널에 제공된 일회용 코드를 입력하면 성공!
  3.  gh repo fork oomia/hands-on-dapp --clone
    공개된 저장소를 복사하면, 명령을 실행하는 현재 위치를 기준으로 'hands-on-dapp' 폴더가 생성됩니다.
  4.  cd hands-on-dapp && ls
    두 번째 이미지처럼 두 개의 파일이 보인다면 성공입니다!

gh auth login
cd hands-on-dapp && ls

3. Visual Studio Code

이제 IDE를 설치하고 본격적인 작업을 시작해봅시다.

  1.  brew install --cask visual-studio-code 
  2.  code .
    다음과 같이 두 개의 파일이 보이면 됩니다.

code .

 


마치며...

이상 개발에 필요한 정말 기초적이고 간단한 환경 설치 과정을 다루었습니다. CLI 기반으로 다양한 명령어를 수행하는 작업은 귀찮지만 앞으로도 계속 진행해야하니 빨리 익숙해지면 좋을 것 같아요. 복사/붙여넣기에 팁이 있다면, Windows에서는  Win + v , MacOS에서는  Flycut  등의 유틸리티 도구를 통해 클립보드 히스토리 기반 붙여넣기가 가능합니다. 또 Windows에서는  Ctrl + ⌫ , MacOS에서는  ⌥ + ⌫ 로 단위별 지우기가 가능합니다. 이 밖에도 다양한 명령어와 단축키를 잘 익혀두면 개발이 더 빨라지겠죠?

 

다음 시간에는 Foundry와 Node.js를 설치하여 기본적인 DApp 개발 환경까지 준비해보도록 하겠습니다 🤗

728x90

'Learn > UPSIDE' 카테고리의 다른 글

3 - 스마트 컨트랙트 개발 환경 셋업  (4) 2025.02.10
2 - DApp 개발 환경 셋업  (1) 2025.02.09
0 - DApp은 어떻게 만들 수 있을까요?  (2) 2025.02.04
UDC 2024 Conference 후기 (2)  (0) 2025.01.09
UDC 2024 Conference 후기 (1)  (2) 2024.11.24