React

Context API 기초

리액트 애플리케이션에서 여러 컴포넌트가 상태를 공유할 때 발생하는 프롭스 드릴링(Props Drilling) 문제와, 이를 해결하기 위한 상태 관리 솔루션의 필요성을 알아보았습니다. 이제 7장 상태 관리 입문의 두 번째 절에서는 리액트가 자체 제공하는 강력한 상태 관리 도구, Context API를 깊이 있게 살펴보겠습니다.

상태, 전환 조건, 결과 동작을 분리해 흐름을 추적합니다.

STATE 1

Context API란?

React Context API는 컴포넌트 트리를 통해 데이터를 내려주는(passing down) 방식 없이도 컴포넌트 간에 데이터를 공유할 수 있는 방법을 제공합니다.

STATE 2

Context API의 주요 요소

Context API를 사용하기 위해서는 다음과 같은 세 가지 주요 요소를 이해해야 합니다.

STATE 3

Context API를 이용한 테마 전환 예제 (통합)

이전 장에서 프롭스 드릴링의 예시로 들었던 테마 전환 기능을 Context API로 재구현해 보겠습니다.