[React] React 설치 및 개발 환경 구축

REACT 공식 사이트: https://ko.reactjs.org/

React – 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리

 

리액트(React)

 - 자바스크립트 UI(사용자 인터페이스) 라이브러리

 

컴포넌트(Component)

 - 사용자 정의 태그

 - 가독성과 재사용성을 높인다.

 

Create React App 설치: npm 이용

npm

 - node.js를 이용해서 만들어진 여러 앱을 명령어 환경에서 쉽게 설치할 수 있도록 도와주는 도구

 

1. Node.js 설치: https://nodejs.org/en/

Node.js

 

2. cmd(명령 프롬프트)에 npm -v를 입력해서 설치한 프로그램의 버전이 뜨면 설치가 된 것이다.

 

3. cmd에 npm install -g create-react-app을 입력한다.

 - 에러가 발생하면 sudo npm install create-react-app을 입력한다.

 

4. cmd에 create-react-app -V를 입력해서 설치한 프로그램의 버전이 뜨면 설치가 된 것이다.

 

 

공식 문서에서 권장하는 방법: npx

 - npm이 프로그램을 설치하는 도구라면, npx는 프로그램을 임시로 설치해서 한 번만 실행시키고 지우는 도구

 - 컴퓨터 공간을 낭비하지 않고, 실행할 때마다 새로 설치하기 때문에 항상 최신 버전의 프로그램이다.

 

React 개발 환경 구축하기

1. 바탕화면에 새 디렉토리(폴더) 생성

 - 권장하는 이름: react-app

 - 설정할 수 없는 이름: react (특수한 문자이기 때문에 create react app이 거절한다.)

 

2. cmd에 cd를 입력한다. cmd에 생성한 디렉토리를 드래그하고 드랍하면, 디렉토리로의 경로가 자동으로 입력된다. Enter.

 

3. cmd에서 디렉토리로 이동한 다음에, create-react-app .을 입력하고 Enter.

 

4. 개발 환경 구축 완료