1강 Create React App으로 리액트 프로젝트 시작하기

• 맥이나 리눅스에 비해 윈도우 사용자들은 개발 환경 구축이 상대적으로 어려움이 있음.
• Create React App(CRA) 이란 패키지를 사용하여 리액트 프로젝트를 가장 빠르고 간결함.

설치 및 실행 순서

1. Node.JS 설치

 

2. npm이란 패키지 관리 도구까지 설치됨

 

3. C 드라이브에 RPT(이 강의에선 React Project Tutorial)란 폴더 생성

 

4. cmd 실행 후 cd 명령어로 RPT로 경로 변경

 

5. npm install -g create-react-app으로 설치

ㄴ여기서 -g는 global 옵션으로 글로벌 패키지 형태로 설치하게 함.

-> 기능 : 지금 만드는 프로젝트 말고도 다른 프로젝트에서도 해당 패키지(여기서는 create-react-app) 사용이 가능하게 함.

 

WARNING : npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.

ㄴ이거 뜨는데 일단 문제는 없으니 넘어가자.

 

6. create-react-app managerxerath

managerxerath라는 이름으로 하나의 React 프로젝트가 생성된다. 이때 react, react-dom, react-scripts같은 기능들도 한번에 다 설치가 같이 됨-> 쉽게 react프로젝트를 만들 수 있음.

 

7. cd managerxerath 로 현재 경로를 managerxerath로 변경 후 yarn start

-> React 프로젝트를 실행함. (기본 브라우저의 기본 리액트 포트인 3000번 포트로 실행됨.)

 

ㄴ만약 실행이 안된다? yarn 패키지가 없는거임~. -> npm install -g yarn으로 yarn 패키지 설치. 이건 npm start로 해도 되지만 yarn을 이용하도록 하자.

 

npm과 yarn의 차이

상대적으로 yarn이 1. 무척 빠르고 2. 병렬적으로 작업을 수행할 수 있고 3. 보안적으로 안정성이 높다. 

(아래 링크를 참조하였음.)

https://javascript.plainenglish.io/npm-vs-yarn-choosing-the-right-package-manager-a5f04256a93f

npm vs Yarn — Choosing the right package manager

 

 

 

1강에서 배운 것 & 다음에 배울 것

배운 것 : create-react-app이란 패키지를 이용해서 react 앱 개발환경을 구축해서 가장 초기 환경의 react앱을 우리의 컴퓨터에서 실행해 봄.

 

배울 것 : VSC(비쥬얼 스튜디오 코드)라는 개발환경을 설치해서 react앱의 소스코드를 어떻게 수정해서 작성할 수 있는지 배울 예정.