리액트 설치와 개발환경 셋팅 (nodejs, visual studio code)

1. Node.js 설치

https://nodejs.org/ko/

Node.js

2021/09/14 기준으로 최신버전은 16.9.1 입니다.

 

이때, Automatically install ~ 이 나오면 체크하지 않고 설치합니다. (체크하면 사용하지 않는 tool도 설치 되기 때문!)

2. Visual Studio Code 에디터 설치

터미널을 사용해보지 않았다면 VS Code 사용 추천!

편의를 위해 다 체크해주었습니다.

 

3. VS Code 한글 설정

 

1. 단축키 Ctrl + Shift + x 를 눌러 익스텐션 창을 연다.

2. korean을 검색하여 Korean Language Pack을 install한 후 Restart를 해준다.

 

한글 버전으로 변경된 것을 확인할 수 있다.

 

4. 코드 작성할 폴더을 생성한다.

파일 - 폴더 열기 로 만든 폴더를 연다. 

작업폴더명이 뜨면 성공!

 

5. 터미널에서 명령어 입력

터미널에 npx create-react-app 프로젝트명 을 입력하여 프로젝트 생성한다.

* npx는 라이브러리 설치 도와주는 명령어

 

[Error]

'npx' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않 습니다. 이름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오. 

 

위와 같은 오류가 뜨면 visual studio code를 재실행 시키거나 환경변수를 설정해주어야 한다.

 

참고 url: wikim.tistory.com/245

'node' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습