[React 입문] 리액트 개발환경 세팅

[ React.js 개념]

: SPA(Single Page Application)기반 개발 프레임워크 

: 컴포넌트 단위 (벽돌 느낌) 

: 비슷한 Angular.js와 Vue.js보다 인기가 많음

 

* SPA 프레임워크

장점 : 하나의 페이지로 구성 + 서버에 1회 리소스 요청 + 필요할때마다 '데이터' 받아서 수정= 화면 깜빡임 X

단점 : SEO (검색엔진최적화)에 약함 

 

---

1. 개발환경 필수 프로그램 설치 

(1) 크롬 브라우저 : https://www.google.co.kr/chrome/

(2) VS code : https://code.visualstudio.com/

(3) git 설치 : https://git-scm.com/downloads

(4) Node 설치 : https://nodejs.org/en/download (LTS 버전으로 설치 : 안정적, 신뢰도 높음)

- 터미널, git bash 에서 설치 확인 : node -v 

(5) 터미널에 Yarn 설치하기 

npm install -g yarn

▲ -g 의미 : 프로젝트 안 x / 내 컴퓨터 전반에서 사용 

yarn -v

▲ yarn 설치 확인

yarn add [설치할 패키지 이름]

// 예시: yarn add react-router-dom

 

 

 

 

 

▼yarn실행시 오류 발생시 클릭 ▼

 

[오류] yarn 현재 시스템에서 이 스크립트를 실행할 수 없습니다.