리액트 작업 환경 설정

1. NodeJS 설치

 

Node.js는 크롬 V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임이다.

이것으로 웹 브라우저 환경이 아닌 곳에서도 자바스크립트를 사용하여 연산할 수 있다.

리액트 애플리케이션은 웹 브라우저에서 실행되는 코드이므로 Node.js와 직접적인 연관은 없지만,

프로젝트를 개발하는 데 필요한 주요 도구들이 Node.js를 사용하기 때문에 설치한다.

이 때 사용하는 개발 도구에는 ECMAScript 6를 호환시켜주는 바벨,

모듈화된 코드를 한 파일로 합치고(번들링) 코드를 수정할 때마다 웹브라우저를 리로딩하는 등의 여러 기능을 가진 웹팩 등이 있다.

 

https://nodejs.org/ko

Node.js

설치 확인

node -v​

  

2. yarn 설치

패키지 관리 도구. npm으로 대체해도 무방하다.

npm install --global yarn

 

https://classic.yarnpkg.com/en/docs/install#mac-stable

설치 확인

yarn --version​

 

3. 에디터 설치

 

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

 

4. Git 설치

 

https://git-scm.com/downloads

Git - Downloads

 

5. create-react-app 

 

yarn create-react-app test-app

test-app 이라는 폴더 밑으로 react 앱이 생성된다.

cd test-app
yarn start

3000번 포트로 리액트 앱이 실행된다.

http://localhost:3000/