context api

리액트 프로젝트를 하다보면 Context API를 사용하여 외부에서 의존성을 주입해야 하는 경우가 종종 있다. 이때 주입하는 의존성은 크게 값, mutate, 그 외 로직의 세 가지로 분류할 수 있을 것 같다. 자바스크립트에서라면 이 세 경우를 굳이 나눠서 생각할 이유가 없다. createContext로 생성한 context의 provider value props에는 무슨 값이던 넣을 수 있고, 그 아래 노드에서는 무슨 값이든 빼서 쓸 수 있다. 물론 이렇게 쓰면 런타임 에러가 발생하고, 그래서 보통은 커스텀 훅으로 감싸게 되지만, 할 수 있다는 게 중요하다.타입스크립트에서 Context API를 사용할 때는 몇 가지 제약 사항이 뒤따른다. 반드시 default value를 제공해야 하는데, 이는 pro..

생각보다 많은 사람들이 context API를 유사 전역상태관리 도구로 여기고 있고, 사실 나 역시도 처음에는 그렇게 알고 있었다. 그러나 잠깐 생각해보면 context API(이하 컨텍스트)의 존재 이유가 전역 상태 관리와는 전혀 상관이 없다는 걸 금방 알 수 있다. 아마 리액트 개발자라면 누구라도 이렇게 대답할 것이다. "컨텍스트를 사용하면 prop drilling을 방지할 수 있다."그렇다면 어째서 대부분의 사람들 ─ 혹은 리액트 1~3년차들 ─ 은 무의식 중에 컨텍스트를 유사 전역상태관리 도구라 여기고 있는 것일까? 여기에는 크게 두 가지 이유가 있다고 본다. 하나는 컨텍스트를 활용하는 예시가 대체로 state와 setState에 치중되어있기 때문이다. 심지어는 이를 새로운 커스텀 훅으로 감싸 진..