[React.js] Node.js 설치부터 리액트 프로젝트 테스트까지 정리

Node.js 설치부터 리액트 프로젝트 테스트까지 정리

들어가며

• Node.js 설치, NVM 설치, 리액트 프로젝트 생성 및 테스트까지의 과정을 정리해본다.

 

방법

(1) Node.js 설치

• 회사 또는 팀에서 사용하고 있는 버전의 Node.js를 설치하도록 한다.

Node.js

 

(2) nvm 설치

• NVM(Node Version Manager)은 Node.js의 버전을 관리해주는 프로그램이다.
• @nvm-setup.exe@ 설치 파일을 다운로드 받아 실행한다.

Releases · coreybutler/nvm-windows

 

(3) React 프로젝트 생성 & 실행

• 아래의 명령을 실행하여 차례대로 실행한다.

> npm install -g create-react-app   # 개발 환경 구축

> npx create-react-app <프로젝트이름>    # 프로젝트로 생성
> cd <프로젝트이름>   # 프로젝트 폴더로 이동
> npm start    # 서버 시작

 

• 웹에 공개할 경우 다음과 같이 빌드 과정을 거친다.

> npm run build   # 프로젝트 빌드 후 공개 전용 파일 생성 (웹에 공개)

> npm install -g serve    # serve 모듈 설치 (빌드가 잘 되었는지 확인하기 위해 웹 서버 필요)
> npx serve -s build    # 설치 실행