[React] 프로젝트 시작하기

김수현·2022년 5월 24일
0

1. 환경세팅

1-1. Node.js 설치

Node.js는 리액트와 관련된 라이브러리들의 손쉬운 설치를 위해 필요한 node의 패키지 매니저 npm/yarn을 위해 필요하다.
https://nodejs.org/ko/

1-2. yarn/npm 설치

npm 은 Node.js 를 설치하게 될 때 같이 딸려오는 패키지 매니저 도구이다.
yarn 은 조금 개선된 버전의 npm 이다.
프로젝트에서 사용되는 라이브러리를 설치하고 해당 라이브러리들의 버전 관리를 하게 될 때 사용한다.
우리가 yarn 을 사용하는 이유는, 더 나은 속도, 더 나은 캐싱 시스템을 사용하기 위함이다.

//git bash
brew install yarn

1-3. create-react-app 설치 및 사용

create-react-app은, 리액트 앱을 만들어주는 도구이다.

yarn global add create-react-app
  • macOS 유저여서 nvm 을 통하여 Node.js 를 설치했다면 yarn global 설치가 제대로 작동하기 위해선 다음 명령어를 사전에 입력해야 한다. ( 윈도우는 상관없음 )
echo 'export PATH="$(yarn global bin):$PATH"' >> ~/.bash_profile

1-4. 사용

사용하기 위해서 다음 명령어 입력

create-react-app hello-react //프로젝트 폴더 생성
cd hello-react //생성한 폴더로 이동
yarn start //실행

정상적으로 실행이 되면, 아래와 같은 웹페이지가 뜬다.


참고URL

https://velopert.com/3621

0개의 댓글