프론트엔드/react.js
[React.js] 리액트 프로젝트 생성
개발자딥게
2022. 11. 14. 12:56
반응형
Create React App
Create React App
리액트 프로젝트를 손쉽게 생성할 수 있게 도와주는 보일러플레이트
다양한 커맨드 제공하고 있음
CRA 장점
1. 개발에만 집중할 수 있게 함.
- 불필요한 코드 비공개
- 강력한 커맨드 제공
2. 모든 브라우저에서 해석되도록 transcompile 지원
- transcompile 라이브러리인 바벨 Babel 내장
- 배포시 코드 번들링(압축)인 웹팩 Webpack 제공
CRA 단점
Create React App은 기본적으로 Client-side Rendering만 지원
Node.js / NPM
Node.js
nodejs.org 사이트 접속 후, node lts 최신버전 다운로드
exe파일로 설치 후, cmd 창에서 "node -v" 입력하면 버전정보 확인 가능. -> 설치 잘 됐다는 확인용
NPM
node package manager
node.js 기반의 모듈을 모아놓은 저장소
설치는 node.js 설치할 때 자동으로 설치된다.
많이 사용하는 명령어
npm install // package.json에 정의된 의존성패키지들을 설치
npm install packageName // 특정 패키지를 설치
npm start // node.js 이용한 프로젝트 실행
npm build // 프로젝트 빌드
ctrl+c // npm start 한 다음 종료하기
리액트 프로젝트 생성
npx
npm 패키지를 1회성으로 내려받아 사용하고자 할때 쓰는 명령어
npx create-react-app myProject // 패키지 내려받기
cd myProject // 디렉토리 이동
npm start // 현재 디렉토리의 프로젝트를 실행
반응형