개발환경 세팅

1. node.js LTS 버전 설치

• 구글에 node.js를 검색 후 lts버전을 설치한다
• 설치경로는 C드리이브로 (안바꾸면 됨)
• 설치 중 chocolatey어쩌구는 설치 안해도 됨

2. vscode

• vscode 에디터 씀
  
  
  

리액트 프로젝트 생성

1. 작업용 폴더 생성

• window : 작업용 폴더를 만들고 shift+우클릭해서 powershell열기
• macOS : 손가락 두개 클릭 터미널 열기

2. 터미널

npx create-react-app blog

그대로 터미널에 입력해주면 blog라는 프로젝트가 생성 됨

3. 에디터에서 프로젝트 오픈하기

2번으로 프로젝트를 설치했으면 프로젝트명으로 폴더가 하나 생성되는데 (blog)
그 폴더를 에디터에서 오픈해서 오픈하면 됨

• vscode : file → Open Folder → 'blog'클릭

4. App.js 가 메인

src폴도 안에 있는 App.js가 메인이니까 여기다 코드 짜면 됨

5. 미리보기 띄우기

내 사이트를 브라우저로 미리보기 띄우고 싶으면 에디터 상단메뉴중에 Terminal → New Terminal클릭
그럼 터미널이 뜨는데 거기엣 npm start입력
✔️ 폴더 오픈 확인하기

터미널 오류 잡기

Q1. "npx command not found ..." 에러

• 터미널 껐다 키기
• node.js 버전 확인 및 다시 설치
• c드라이브에 설치되어있는지 확인

Q2. 맥북 "permission이 없어요" 에러

• 프로젝트 생성 시 이런 에러가 뜨면 터미널에
  sudo npx create-react-app blog 입력
  비번입력하라고 하면 맥북 비번 입력

Q3. 윈도우 "허가되지 않은 스크립트 ..." 에러

• 윈도우 하단 검색메뉴에 Powershell 검색 → 우클릭 → 관리자 권한으로 실행한 뒤
  Set-ExecutionPolicy Unrestricted입력
• 뭐 선택하라고 하면 y

Q3. The engine "node" is incompatible with this module 에러

• npx로 설치 시 이런 에러가 있을 수 있음
• node.js 버전이 낮거나 너무 높다는 뜻
• node.js를 요구하는 버전으로 재설치

#Summary

1. node.js lts버전을 설치
2. 작업용 폴더 만들고 shift+우클릭해서 powershell열기
3. 터미널에 npx create-react-app 프로젝트명