Context란?React v16 부터 도입된 내장 API 이며, 컴포넌트간에 Props로 데이터를 전달하지 않고 데이터를 공유할 수 있게 해주는 기술이다. 하지만 착각하기 쉬운 것이 있다. Context API는 "상태관리"를 해주는 기술이 아니다. 정확히는 상태를 쉽게 "공유" 할 수 있게 해주는 다리와 같은 역활이다. 이는 컴포넌트간 Props로 계속해서 전달하는 Prop Drilling을 피할 수 있으며, 깊이와 무관하게 데이터가 필요한 컴포넌트에서 불러 데이터를 사용할 수 있게 된다. Context 생성Context를 사용하려면 React의 createContext를 이용해 Context를 생성해 준다. createContext의 인수로 초기값이 전달된다. 또한 Provider의 value로 ..
context api

Context API는 리액트 프로젝트에서 전역적으로 사용할 데이터(로그인 정보, 환경 설정, 테마 등) 가 있을 때 유용하게 사용된다. 리덕스, 리액트 라우터, styled-components 등의 라이브러리들은 Context API를 기반으로 구현된다. 1. Context API를 사용한 전역 상태 관리 흐름 리액트 애플리케이션은 컴포넌트간 데이터를 props로 전달하기에 필요한 데이터가 있을 때 주로 최상위 컴포넌트인 App의 state에 넣어 관리한다. → 항상 최상위 컴포넌트에서 목표하는 컴포넌트에 정보를 전달하기 까지 연결된 컴포넌트를 여러번 거쳐야한다. 이런 방식은 유지 보수성이 낮아질 가능성이 있다. 이러한 문제를 해결하려면 Context API를 사용하면 된다. Context API를 사..