1장 리액트 시작

모델은 애플리케이션에서 사용하는 데이터를 관리하는 영역이고, 뷰는 사용자에게 보이는 부분.
프로그램이 사용자에게서 작업을 받으면 컨트롤러는 모델데이터를 조회하거나 수정하고 변경된 사항을 뷰에 반영.
보통 뷰를 변형하여 반영함. 쉽게말해 html 요소를 찾아서 변형한다고 보면됨.
근데 이게 애플리케이션 규모가 커지면 복잡해짐
⇒ 기존 뷰를 날려버리고 처음부터 새로 렌더링하자.

리액트 이해

리액트는 오직 뷰만 신경 쓰는 라이브러리임.
리액트 프로젝트에서 특정부분이 어떻게 생길지 정하는 선언체를 컴포넌트 라고 한다.
사용자 화면에 뷰를 보여주는 것을 렌더링 이라고 한다.
리액트 컴포너트가 최초로 실행한 초기 렌더링 과 컴포넌트의 데이터 변경으로 다시 실행되는 리렌더링 이 있음.

초기 렌더링

render 함수 뷰가 대한 정보를 반환함. 즉, 렌더링을 한다.
렌더링작업이 끝나면 토대로 HTML 를 만들고 이를 페이지의 DOM 요소 안에 주입한다.

조화과정

변화가 있을 때, 새로운 요소로 갈아 끼운다고 보면됨.
새로운데이터를 가지고 render 함수를 호출해서 만들어진 dom 트리를 비교함.
비교해서 다른 부분만 업데이트 한다고 보면됨.

리액트의 특징

웹브라우저 단에서 DOM에 변화가 일어나면 css 다시 연산하고, 레이아웃 구성하고 등등… 시간 낭비 심함.
⇒ 이를 해결하기 위해 Virtual DOM 방식 사용하여 DOM 업데이트 ㄷ추상화함

1. 데이터를 업데이트 하면 전체UI를 virtual DOM에 렌더링
2. 이전 Virtual DOM 에 이던 내용과 현재 내용 비교
3. 바뀐부분만 실제 DOM 에 적용