CRA
CRA(Create React App) 방식으로 프로젝트를 생성하는 방식에 대해서 살펴본다.
npm을 이용하여 React Project Template 프로젝트를 생성할 수 있다.
이를 위해서는 NodeJS가 PC에 설치되어 있어야 한다. 설치 방법은 하단 문서를 참고한다.
NodeJS설치 확인은 다음과 같은 명령으로 한다.
프로젝트 생성은 터미널에서npx 명령을 사용한다.
npx create-react-app 프로젝트이름
npx는 npm 5.2+ 버전의 패키지 실행 도구이다.
생성한 프로젝트 폴더로 이동하여 프로젝트를 실행한다.
별도의 설정이 없는 한 3000번 포트에서 실행하며, 만약 3000번 포트가 사용중이라면 경고 메세지가 나오며 Y를 누를 경우 겹치지 않는 포트번호를 찾아 실행한다(3001, 3002, ...)
create-react-app으로 생성된 프로젝트는 자동으로 Git 프로젝트로 설정되기 때문에 별도의 저장소를 사용할 경우 이를 해제해야 한다.
프로젝트 생성 명령 뒤에 --skip-git 옵션을 추가하여 해결한다.
프로젝트 폴더
node_modules - npm으로 설치한 모듈의 위치
public - 프로젝트에 포함될 정적 파일의 위치
src - 프로젝트 소스 파일의 위치
App.test.js - 메인 컴포넌트 테스트 파일
index.css - index.js에서 불러오는 기초 CSS 파일
reportWebVitals.js - 프로젝트 상태 확인 및 서드파티(ex : 구글 애널리틱스) 연동 파일
setupTests.js - 테스트를 위한 JEST 설정 파일
.gitignore - Git 제외 명단 작성 파일
package-lock.json - 프로젝트 의존성 및 버전 관리용 파일
package.json - 프로젝트 의존성 및 버전 관리용 파일