노트북 변경시 프론트엔드 개발자의 초기 셋팅

노트북, 혹은 pc 등 개발도구를 변경할 때마다 프론트엔드 개발자의 초기 셋팅을 구글링하는게 지쳐서 정리해본다. 앞으로 초기 셋팅할 경우가 생겼을 때 이 글을 먼저 보고, 그 후 생기는 오류들을 구글링하면 될 것 같다. 

 

준비물: 최신 커밋한 깃 허브 레포지토리, .env 파일, 맥북, 인내심

 

맥북인 경우,

** iterm2에서 진행

 

1. 아래 링크

프론트엔드 개발자의 맥북에어 m1 16g 256gb + 투명케이스

에서 iterm2 및 기초 세팅한다. 

 

2. node 설치 (npm 같이 설치됨)

 brew install node
 
 // 버전 체크 
 node -v
 npm -v

 

3. yarn 설치

brew install yarn
Password: // 내 노트북 비번 (타이핑 화면 안나오니 비번치고 바로 enter하면 됨)

// 버전 체크
yarn -v

 

4. react 전역 설치

yarn global add create-react-app

 

5. next 사용할 경우, test 폴더 하나 만들어서 아래코드 실행

npx create-next-app@latest

** 오류  백프로 뜬다.. 뜰 경우 오류 설명 코드("fix this problem ~")를 잘 읽고 그 코드 복붙하면 된다. 

 

 ++ 깃허브에서 기존 프로젝트 가져와서 클론할 경우

깃 클론 후, (깃 허브 데스크탑 쓰면 오류가 안나서 편하다)

yarn install

위 코드로 패키지 설치후, 아래 코드로 프젝 실행 + .env 폴더 추가

yarn run dev

 

다했는데도 안될 경우, 우선 터미널을 껏다가 켜보고 안되면 구글링하기