[React] React 개발환경

React란?

React는 페이스북에서 제공하는 '라이브러리'이다. 웹에 꼭 필요한 도구가 기본적으로 제공되지 않아 가볍고 자유롭게 쓸 수 있다. component 기반으로 되어있어 여러 부분을 나눠 제작이 가능하여 유지 보수하기 좋은 라이브러리라 생각이 든다. Virtual Dom을 사용하기에 개발 도중 TEST 후 마지막으로 수정된 결과만 DOM으로 가져가기에 프로세스를 더욱 효율적으로 사용한다. 

 

Node.js 설치 

React 개발환경을 갖추기 위해선 npm과 Node.js가 필요하다.

https://nodejs.org/ko/

Node.js

여기서 로컬 환경에 맞게 설치한다. next 해도 무방하다.

설치가 끝나면 cmd창을 열어 설치가 잘되었는지 확인한다.

node -v // node.js 버전 확인
npm -v // npm 버전 확인

프로젝트 생성

태그 방법도 있지만 CLI로 생성

npm i -g create-react-app //create-react-app 모듈 설치

모듈을 먼저 설치한다.

create-react-app {프로젝트 이름} //소문자만 생성 가능

조금 로딩이 있을 수도 있지만 기다리면 프로젝트가 생성된다.

 

혹시 

Cannot create a project named "{프로젝트 이름}" because of npm naming restrictions: * name can no longer contain capital letters Please choose a different project name.
이런 에러가 발생한다면? 프로젝트 이름에 대문자를 소문자로 변경해야 된다.

여러 Tool이 있지만, 저는 Intellij를 사용하기에 Intellij로 프로젝트를 열고 Intellij에서 제공하는 terminal에서 

npm start //프로젝트 실행

프로젝트 실행을 하게 되면 

실행되는 걸 확인할 수 있다.