반응형

props drilling 2

React의 Context API로 전역 상태 관리하기 – props drilling 없이 데이터 전달

React 애플리케이션이 커지면서 컴포넌트 간에 데이터를 전달하기 어려워지는 경우가 많습니다. 이때 Context API를 사용하면 전역 데이터를 간단하게 관리할 수 있습니다.1. props drilling 문제란?상위 컴포넌트의 데이터를 하위로 계속 전달해야 하는 상황을 props drilling이라고 합니다. 예: 이런 구조는 관리가 어렵고, 중간 컴포넌트는 실제로 데이터를 사용하지 않더라도 전달해야 합니다.2. Context API 기본 사용법1) Context 생성import { createContext } from 'react';export const UserContext = createContext(null);2) Provider로 감싸기import { UserC..

Programming/React 2025.04.11

React에서 Context API로 전역 상태 관리하기

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 ( ..

Programming/React 2025.04.11
반응형