[React] React 프로젝트 생성과 실행

리액트 프로젝트 생성을 위한 프로그램 설치

1. Node.js

다운로드 | Node.js

---

2. Npm / Yarn

Yarn

cmd 에서 명령어 입력

npm install -g create-react-app

npm install                     npm 설치

create-react-app          React 프로젝트를 생성하는 명령어 설치        

-g                                        시스템 공통 폴더에 설치해줘서 프로젝트 생성할 때 위 명령을 다시 입력할 필요가 없어진다.

---

3. Visual Studio Code

Visual Studio Code - Code Editing. Redefined

---

설치 후 확인

 

cmd 에서

npm -v

yarn --version

내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 문구가 출력 되면 제대로 설치가  되지 않은 것이다.

---

 

리액트 프로젝트 생성

Visual Studio Code를 켜서 Ctrl + k + o를 눌러 작업할 공간을 지정한다.

프로젝트를 생성할 위치

---

터미널을 생성 후 프로젝트 생성 명령어를 입력한다.

yarn create react-app 프로젝트 이름

"react_notice_board" 프로젝트 생성

 

프로젝트 생성에서 오류 발생 시 - [React] 이 시스템에서 스크립트를 실행할 수 없으므로 ~ 파일을 로드할 수 없습니다.

---

터미널에 명령어를 입력해서  프로젝트를 실행한다.

cd 프로젝트 이름

yarn start
또는
npm start

실행 결과