리액트 create-react-app 세팅하기

 

 

강의에도 세팅하는 법 나오는데 전에 벨로그에 글 써둔게 있어서 옮겨왔다.

근데 지금보니까 왜 powershell에서 cra를 했지??

일단 글 그대로 옮겨옴.

맨 아래에 지금 쓰는 방법도 해놨어요 참고

 

---

https://www.youtube.com/watch?v=00yJy7W0DQE
코딩 애플님 유튜브를 참고하여 리액트 세팅을 시작하였다.




1. Node.js 설치하기
https://nodejs.org/ko
홈페이지에서 LTS로 설치하였다. 
    높은 버전일 때 실행 오류가 날 수 있다고 주워들어서 대충 권장하는 걸로 했다..
    
    
2. 새 폴더 생성하기
원하는 위치에 새 폴더를 생성한다. 

 

3. 폴더 shift+우클릭 PowerShell에서 열기
폴더를 shift+우클릭하면 중간에 여기에 PowerShell 창 열기를 누른다.

 

 

4. npx create-react-app 파일이름  입력하기
npx create-react-app 파일이름 을 shell에 입력한다.
파일 이름은 띄어쓰기 없이 - 를 활용해서 작성한다.

 

5. VS Code 에서 터미널 열기 
VS Code를 켜서 폴더 안에 파일을 열고 왼쪽 위에서 터미널 - 새 터미널을 연다. 그럼 하단에 터미널 창이 생긴다.

 

6. npm start
터미널에서 npm start를 입력한다. 그러면 리액트 실행 창이 뜰 것이다!!!

   이렇게 보면 정말 쉽게 세팅할 수 있다.
   그러나 사실 나는 세팅하는데 하루가 넘게 걸렸는데...
   알 수 없는 여러 오류들 때문이었다... 진짜 모든 오류 다 겪은 거 같다ㅠㅠ...

---

 

이후 새롭게 만들 때에는

 

새 폴더 하나 만들고

VSCode에서 터미널 열어서 npx create-react-app 파일명

npm start

 

 

만약 npm start 했을 때 에러가 난다면 파일 위치를 잘 확인해보길 바란다.

터미널에서 cd 파일명 입력해서 실행할 파일로 옮길 수 있음

 

오류도 글 올려두겠슴니닷.