본문 바로가기
Javascript

[React] 1분만에 React 프로젝트 구축하기

by 노력남자 2020. 6. 7.
반응형

create-reac-app 라이브러리를 통해 1분만에 React 프로젝트를 구축해보겠습니다.

 

1. Nodejs 설치하기

 

Windows 

 

Nodejs 공식 홈페이지 접속 -> 내 운영체제에 맞는 .msi 파일 다운로드 후 설치

* LTS : Long-Term Support (Stable 버전)

 

 

Mac (Linux 도 동일)

 

mac에선 nvm (Node Version Manager) 을 이용해서 설치합니다.

 

nvm 설치 -> nvm install 명령어로 npm LTS ver. 설치

 

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

nvm install -- LTS Ver.

 

 

2. create-react-app 설치

 

create-react-app 라이브러리는 facebook에서 제작한 것으로 번거로운 react 환경 구축 절차를 쉽고 빠르게 구축할 수 있게 만든 라이브러입니다.

 

npm을 이용해서 create-react-app을 설치해줍니다. 

 

npm install -g create-react-app

 

3. create-react-app 실행

 

react 프로젝트를 만들고 싶은 경로에 들어간 후 heolloworld 프로젝트 생성 명령어를 실행해줍니다.

 

3~5분정도 소요됩니다.

 

create-react-app helloworld

 

명령어를 실행하면 라이브러리에 대한 정보가 위에 쭈르륵 나오는데 무시해주시고 좀 기다리면 아래와 같이 success가 나옵니다.

 

happy hacking 은 GNU 설립자 리처드 스톨먼의 인사말로 "즐거운 프로그래밍 하세요." 라는 뜻을 가지고 있다. 여기서 hacking이 우리가 평소에 쓰는 해킹이 아니라 프로그래밍이라는 뜻으로 쓰이는 듯 하다.

 

4. npm start

 

생성된 프로젝트에 접속 -> npm start

 

cd helloworld

npm start

 

명령어를 실행하면 아래와 같이 접속 URl이 나옵니다. Local에 나와 있는 주소로 접속

(별도 설정을 하지 않았기 때문에 http://localhost:3000로 접속하시면 됩니다.)

 

 

http://localhost:3000으로 접속하면 아래와 같은 화면이 나오면서 react 프로젝트 구축 끝!

 

 

읽어주셔서 감사합니다.

반응형

댓글