DOTI Project

React 앱을 개발하다 보면 여러 컴포넌트가 같은 상태를 필요로 하는 경우가 있습니다. 이럴 때마다 props로 전달하는 건 번거롭고 복잡해지죠. Context API는 이런 문제를 해결하기 위해 전역 상태를 공유할 수 있는 방법을 제공합니다.1. Context API란?Context API는 컴포넌트 트리 전체에 데이터를 전달할 수 있는 기능을 제공합니다. Provider와 Consumer 개념을 통해 상태를 공유할 수 있습니다.2. Context 생성 및 Provider 정의// ThemeContext.tsximport { createContext, useContext, useState } from 'react';type Theme = 'light' | 'dark';const ThemeContext..

React 앱이 커지면서 여러 컴포넌트 간에 상태를 공유해야 할 경우가 많아집니다. 이때 props drilling 문제를 피하고 전역 상태를 효율적으로 관리할 수 있도록 돕는 도구가 바로 Context API입니다.1. Context API란?Context API는 React에서 전역적으로 데이터를 공유할 수 있도록 도와주는 기능입니다. 부모-자식 관계를 타고 props를 전달하지 않고도 상태를 공유할 수 있습니다.2. 사용 예제// 1. Context 생성const ThemeContext = React.createContext();// 2. Provider로 상태 공유function App() { const [theme, setTheme] = useState('light'); return ( ..