처음 만난 리액트 문서
4.5 마치며
이번 장에서 배운 내용은 아래와 같습니다.
- 엘리먼트
- 엘리먼트의 정의
- 리액트 앱의 가장 작은 빌딩 블록들
- 화면에 나타나는 내용을 기술하는 자바스크립트 객체
- 리액트 엘리먼트는 DOM 엘리먼트의 가상 표현
- 엘리먼트의 생김새
- 엘리먼트는 자바스크립트 객체 형태로 존재
- 컴포넌트 유형과 속성 및 내부의 모든 자식에 대한 정보를 포함하고 있는 일반적인 자바스크립트 객체
- 엘리먼트의 특징
- 불변성을 갖고 있음
- 엘리먼트 생성 후에는 자식이나 속성을 바꿀 수 없음
- 엘리먼트의 정의
- 엘리먼트 렌더링하기
- 렌더링을 위해 ReactDOM의 createRoot() 함수를 사용해서 만든 root의 render()라는 함수를 사용
- 리액트 엘리먼트를 HTML 엘리먼트에 렌더링하는 역할
- 렌더링되는 과정은 Virtual DOM에서 실제 DOM으로 이동하는 과정
- 렌더링을 위해 ReactDOM의 createRoot() 함수를 사용해서 만든 root의 render()라는 함수를 사용
- 렌더링된 엘리먼트 업데이트하기
- 엘리먼트는 한 번 생성되면 바꿀 수 없기 때문에, 엘리먼트를 업데이트하기 위해서는 다시 생성해야 함
- 기존 엘리먼트를 변경하는 것이 아니라 새로운 엘리먼트를 생성해서 바꿔치기하는 것
마지막 업데이트: 2025년 08월 21일 08시 11분
이 문서의 저작권은 이인제(소플)에 있습니다. 무단 전재와 무단 복제를 금합니다.
On this page