[React.js] 리액트를 사용하는 이유

2023-09-21

230922-144417

가상돔(Virtual DOM)

React는 직접적으로 DOM을 조작하지 않고 중간에 가상의 돔을 두고 이 가상돔이 변경되면 실제 DOM이 변경되도록 설계되어 있습니다.

가상돔의 내부 동작 원리

가상돔의 값을 직접적으로 변경하면 안되는데 그 이유는 간단합니다.
리액트의 state(상태)는 불변성을 유지해야 하기 때문입니다.
리액트는 기본적으로 setState를 비교해서 업데이트가 필요한 경우에만 render() 함수를 호출합니다. 이 때문에 state를 직접 변경하게 되면 리액트가 render() 함수를 호출하지 않아 상태 변경이 일어나도 재렌더링이 일어나지 않을 수 있습니다.
따라서 가상돔의 상태 업데이트는 setState()를 호출하는 방법을 사용해야 합니다.

컴포넌트 단위의 개발

컴포넌트란 프로그래밍에 있어서 재사용이 가능한 각각의 독립된 모듈을 의미합니다.
저는 여기서 더 나아가 컴포넌트의 정의를 기능별로 분리된 독립된 모듈로 정의합니다.
기능별로 쪼개기 때문에 객체 지향 프로그래밍의 핵심인 추상화, 캡슐화에 더 용이합니다.

다른 프레임워크와 혼용 가능

리액트는 라이브러리이기 때문에 다른 프레임워크 또는 라이브러리들과 혼용가능합니다.

react

프로필 사진
TaeWoo Kim
Junior Frontend Engineer