리액트 시작하기

리엑트는 라이브러리다.
페이스북에서 만들어졌고, 2013년도 발표가 되었다.

컴포넌트로 이루어져 있어서, 모듈처럼 재사용성이 굉장히 뛰어나다.

virtual DOM => real Dom vs virtual Dom

real DOM은 list가 10개가 있는 것 중 1개가 변화가 일어나면, real Dom에서는 모든 것을 없애고 다시 가져온다.

virtual DOM에서는 하나만 가지고 올 수 있다.

어떻게 업데이트 된 것만 가지고 올 수 있냐면 => 스냅샷을 찍어놓고, 스냅샷을 찍어 둔 것과 차이를 분석해서, 바뀐 부분만 real DOM에서 바꾸어 준다.

Babel : 최신 자바스크립트 문법을 지원하지 않는 브라우저들을 위해서 
최신 자바스크립트 문법을 구형 브라우저에서도 돌 수 있게 변환시켜줌

webpack : 웹사이트를 만들 때 단순하게, 자바스크립트 몇개 파일 html이런게 아니라 라이브러리, 프레임워크를 사용하면서 굉장히 복잡하게 되었다. 이렇게 복잡하게 된 것을 webpack을 활용해서 간단하게 묶어 준다. => src폴더만 모아준다.

원래 리액트 앱을 처음 실행하기 위해선 webpack이나 babel 같은 것을 설정하기 위해
엄청 나게 많은 시간이 걸렸으나 지금은 create-react-app Command로 바로 시작할 수 있다.

react 다운 받을 때 => npx create-react-app .

npm vs npx의 차이는?
npm => 라이브러리들이 저장되어 있는 곳? npm run build package.json에 모두 저장되어 있다. (node package manger)

-g => global로 다운로드(usr/local/bin) / 따로 하지 않으면 local에 다운로드 된다.(node module)

옛날에 react를 다운 받을 때는 global에 다운받아서 사용했으나,
이제는 npx를 이용해서 그냥 npm registry에 있는 것을 사용할 수 있다.
disk space를 낭비하지 않고 항상 최신 버전을 사용할 수 있다.