Javascript
라이브러리 이다.DOM
을 다루지 않아도 React
가 데이터 상태에 따라 자동으로 UI를 관리해주므로 특정 상태에 따른 인터페이스 구현에 집중할 수 있게 해준다.props
나 state
를 입력받아 DOM Node
를 출력하는 함수props
는 부모 컴포넌트
에서 자식 컴포넌트
로 전달해 주는 데이터이다.props
를 변경할 수 없고 props
를 전달해준 부모 컴포넌트에서만 props
를 변경할 수 있다.state
는 동적인 데이터를 다룰 때 사용한다.state
는 클래스형 컴포넌트
에서만 사용할 수 있는데, 각각의 state
는 독립적이라 다른 컴포넌트의 직접적인 접근은 불가능하다.state
를 변경하는 삼수를 props
로 받는다면 변경이 가능하다.데이터(props)
는 부모 컴포넌트로 부터 자식 컴포넌트에게로 흐른다.MVC 패턴 ❗
- 프레임워크들은 데이터단을 담당하는 모델(Model)
- 사용자의 화면에서 보여지게 되는 뷰(View)
- 사용자가 발생시키는 이벤트를 처리하는 컨트롤러 (Controller)
위와 같은 세가지로 이루어진 패턴을MVC 패턴
이라고 말한다.
이벤트
가 발생했을 때 모델
에 변화를 일으키고, 그 결과에 따라 어떤 DOM을 가져와서 어떻게 뷰
를 업데이트 할지 정해야 한다.Virtual DOM
이다.DOM(Document Object Model)
DOM
에 한번 렌더링 후 기존의 DOM
과 비교DOM
조작이 일어나면 브라우저는 렌더링을 위해 연산 작업을 하는데, 그것을 한번만 하게하기 때문에 연산 횟수가 줄어들어 성능이 좋아진다.DOM
보다 Virtual DOM
이 빠른것은 아니다.한번 React
를 사용해보면 다른 것은 사용하기 힘들정도로 유용하고 편리하다던데 얼마나 편리할지 궁굼하다.🔥🔥