[React] 리액트 SPA, 컴포넌트 단위, yarn 명령어

React란?

SPA 기반 프론트엔드 프레임워크 중 하나이며,

컴포넌트 단위의 독립적인 블록을 이용한 개발 방법을 이용합니다.

비슷한 프레임워크인 Angular JS, Vue JS 보다 월등히 인기가 많다!

---

SPA란?

Single Page Application,

한 개의 페이지로 이루어진 어플리케이션으로 

MPA(Multi Page Application)과는 상반된 개념이다.

 

MPA의 문제점

1. 좋아요 눌렀는데 웹사이트 다시 로딩

2. 요즘에는 페이지가 새로고침되는 상황이 너무 많기 떄문에 계속 깜빡거림.

---

React의 특징과 장점

1. 한 개의 페이지로 구성된 웹

2. 서버에 1회 리소스를 요청

3. 그 이후 필요할 때 데이터만 받아와서 기존 페이지를 '수정' 하는 방식으로 요소를 변경

4. 사용자 입장에선 굉장히 자연스러운 UX를 구현 가능

 

---

yarn 설치 및 명령어

 

yarn 설치 : npm install -g yarn

 

명령어	npm	yarn
dependencies 설치	npm install	yarn
패키지 설치	npm install [패키지명]	yarn add [패키지명]
dev 패키지 설치	npm install —save-dev [패키지명]	yarn add —dev [패키지명]
글로벌 패키지 설치	npm install —global [패키지명]	yarn global add [패키지명]
패키지 제거	npm uninstall [패키지명]	yarn remove [패키지명]
dev 패키지 제거	npm uninstall —save-dev [패키지명]	yarn remove [패키지명]
글로벌 패키지 제거	npm uninstall —global [패키지명]	yarn global remove [패키지명]
업데이트	npm update	yarn upgrade
패키지 업데이트	npm update [패키지명]	yarn upgrade [패키지명]