create-react-app으로 프로젝트 생성//웹팩,바벨부터 서버까지 자동생성

thebook.io/080203/ch01/03/05/

 

create-react-app은 리액트 프로젝트를 생성할 때 필요한 웹팩, 바벨의 설치 및 설정 과정을 생략하고 바로 간편하게 프로젝트 작업 환경을 구축해 주는 도구입니다. 나중에 설정을 커스터마이징해야 하면 자유롭게 설정을 변경할 수도 있습니다.

이 도구를 사용하는 방법은 매우 간단합니다. 터미널을 열고, 프로젝트를 만들고 싶은 디렉터리에서 다음 명령어를 실행하세요.

 

$ yarn create react-app hello-react

리액트 프로젝트를 만들 때는 이렇게 yarn create react-app <프로젝트 이름> 명령어를 사용합니다.

프로젝트 이름은 자유롭게 정하면 됩니다.

 

이렇게 명령어를 입력하고 나면 다음과 같은 결과가 터미널에 나타납니다.

$ yarn create react-app hello-react yarn create v1.12.3 [¼] Resolving packages… [2/4] Fetching packages… [¾] Linking dependencies… [4/4] Building fresh packages… success Installed “create-react-app@3.0.0” with binaries: - create-react-app

Creating a new React app in /Users/velopert/playground/react/hello-react.

Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts…

yarn add v1.12.3 [¼] Resolving packages… [2/4] Fetching packages… [¾] Linking dependencies… (…) [4/4] Building fresh packages… (…) Done in 9.45s.

Initialized a git repository.

Success! Created hello-react at /Users/velopert/playground/react/hello-react Inside that directory, you can run several commands:

yarn start Starts the development server.

yarn build Bundles the app into static files for production.

yarn test Starts the test runner.

yarn eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

cd hello-react yarn start

Happy hacking! Done in 16.58s.

노트

📌 yarn을 사용하지 않는 경우

yarn을 사용하지 않는 경우라면 다음 명령어를 사용하여 리액트 프로젝트를 생성할 수 있습니다.

$ npm init react-app <프로젝트 이름>

 

프로젝트 생성이 완료되었다면 다음 명령어를 입력하여 프로젝트 디렉터리로 이동한 뒤 리액트 개발 전용 서버를 구동해 보세요.

$ cd hello-react $ yarn start   //또는 npm start

이렇게 명령어를 입력하고 나면 터미널에는 다음과 같은 결과가 나타납니다.

✅ 이어서 번들러 보기 

cheri.tistory.com/89