React 란 (Section 1)

참고> velopert.com/3612

 

1. 요즘 웹은 단순한 웹 페이지가 아니라 웹 애플리케이션.
-> 브라우저 상으로 자연스러운 흐름을 통한 많은 것을 할 수 있음.

2. 사용자와의 인터랙션이 별로 없는 웹사이트라면 프론트엔드 라이브러리를 굳이 쓸 필요 없이
직접 만들면 됨.
-> But, 인터랙션이 많아지고 프로젝트 규모가 커지면 라이브러리가 꼭 필요

3. 대표적인 JavaScript 라이브러리로 Angular, Ember, Backbone, Vue, React 등이 있음
-> 라이브러리들마다 저마다의 특성이 있음

4. Angular
-> 라우터, HTTP 클라이언트 등 웹 프로젝트에서 필요한 대부분의 도구들이 내장
-> Angular 1은 나온지 오래되서 많은 기업에서 이미 사용중임
-> Angualr 2는 Angular 1보다 발전됐지만 인지도 측면에서는 성장 중이며 주로 타입스크립트와
함께 쓰임

5. React
-> "컴포넌트" 라는 개념에 집중되어 있는 라이브러리
-> 많은 곳에서 사용됨
-> Angular 처럼 웹 프로젝트에 필요한 여러 도구들이 내장되어 있진 않음.
-> 따로 공식 라이브러리가 있는 것도 아니어서 개발자가 원하는 스택을 골라 쓸 수 있음.

6. Vue
-> 입문자에게 쉬움
-> Webpack 등의 모듈 번들러로 프로젝트를 구성해야 하는 Angular, React와 달리 단순히
CDN에 있는 파일을 로딩 하는 형태로 스크립트를 불러들이기 때문에 사용하기 편함

7. React의 발생 배경: 새로운 뷰가 필요하면 Mutation(변경) 하지 말고 그냥 날려버리자.
날려버리고 새로운 뷰를 생성해서 집어넣자.

8. Virtual DOM : React에서 Mutation이 아닌 새로운 뷰를 그때 그때 만들기 위해 사용하는 개념
-> 변화가 일어나면, 실제 browser의 DOM을 바로 새로 갈아끼는 게 아니라, 
Javascript로 이뤄진 가상 DOM에 한번 렌더링하고,
기존 DOM과 비교해서 정말 필요한 부분만 업데이트 해줌.
-> 즉, 데이터가 바뀌었다면 어떻게 업데이트 할지를 고민하는게 아니라
일단 바뀐 데이터로 그려놓고 기존에 그려진 것과 비교해서 다른 부분만 바꿔줌.

9. Virtual DOM은 DOM 변화를 최소화시켜주어 성능을 높여주기 때문에 매우 중요함.

10. Virtual DOM은 React 이외에도 VUe, Marko 등 다른 라이브러리에서도 많이 쓰는 개념임.

11. React 장점 3가지
-> 엄청난 생태계 (예전의 jQuery 처럼)
-> 이미 많은 곳에서 사용중임 (로켓펀치 등에서 검색해보면 예전보다 엄청 많아짐)
-> 한번 써보면 좋아하게 된다.