프론트엔드 개발자를 위한 리액트 기초 part-2

리액트를 마주하게 되면 가장 먼저 보게 되는 CRA 즉 Create React App 이 아이의 경우 페이스북에서 만들어진 react 웹 개발용 boilerplate라고 할 수 있다. 그 전까지는 직접 모든 환경들을 설정해야 하거나 또는 남이 만든  boilerplate를 사용했어야 했는데 여기에 es6 버전의 javascript로 작성하는 것이 일반화 되어있어서 webpack같은 모듈 번들러로 컴파일을 하거나 빌드를 하는 것이 필수이기 때문에 이런 환경까지 공부하는 것이 쉬운 일은 아니다.

 

그래서 이런 사람들의 어려움을 이해(?) 하고자 create-react-app이 만들어지게 되었으며 지속적으로 업데이트가 되기 때문에 더욱 편하게 사용할 수 있게 되었다.

 

create-react-app으로 시작하기

 

- create-react-app은 리액트로 웹 애플리케이션을 만들기 위한 환경을 제공한다.

- create-react-app을 이용하게 된다고 한다면 기존 기능을 개선하거나 또는 새로운 기능을 추가했을 때 패키지 버전을 올리면 된다.

 

Node.js 설치하기

 

- Node.js LTS를 설치합니다.

<Node.js>를 설치해야 하는 이유

- javascript로 작성된 라이브러리를 설치할 떄 NPM을 사용하기 위해서이다.

 

'12.18.3 LTS' 와 '14.9.0 Current'의 차이점

 

- `Node.js`를 만드는 개발자들은 4월에서 10월에 메이저 버전의 Node.js를 출시합니다.

- 짝수 메이저 (4월) / 홀수 메이저 (10월)→ 출시 후 Current

- 4월에 출시된 짝수 메이저 버전 Node.js→ 6개월간 Current→10월에 LTS버전

 

10월

 

- 같은 해 4월에 출시되니 버전이 LTS버전이 됨

- 홀수 메이저 버전인  Node.js가 새로 출시

 

LTS버전이란?

 

- Long Term Support 줄임말 →Node.js 커뮤니티에 의해 장기간 지원받을 수 있는 버전이란 뜻

- 30개월동안은 해당 버전에서 발견되는 각종 버그 등에 대한 패치(수정)

- Node.js 커뮤니티로부터 보장받을 수 있음

- 이는 프로그램의 안정성 등에 집중하여 실제 서비스용으로 배포하기 위한 용도

- 실 서비스에서 Node.js 사용 시 LTS 버전을 사용해야 한다.

 

Current 버전이란?

 

- 안정성보다는 새로운 기능 추가 등에 집중하기 위한 용도로 관리되는 버전

 

첫 React Project 만들어 보기

 

# react 프로젝트 초기하기
npx create-react-app my-app

# 폴더 이동하기
cd my-app

# react 실행하기
npm start