본문 바로가기

ContextAPI2

[React] 전역 상태관리 라이브러리 장단점 비교 정리 React로 개발을 진행하다보면 Component의 상태관리를 하게된다. 그런데 해당과정에서 컴포넌트의 Depth가 깊어질수록 반복적인 코드작성이 많아지고 그 횟수가 1000번이라고 생각하면 시간도 어마어마하게 걸릴것이다. 이와 같은 경우 전역적으로 상태를 관리해주는 라이브러리를 사용해서 해결할 수 있으며 종류마다 장단점이 있다. Redux 상태관리를 위해 사용하는 자바스크립트 라이브러리이다. 리액트에서만 사용할 수 있는 라이브러리가 아닌 독립적으로 분류되어있는 라이브러리이기 때문에 리액트 뿐 아닌 Vue나 앵귤러 등에서도 사용이 가능하다. Redux는 가장 많이 사용되는 전역 상태 관리 라이브러리 중 하나이며, 컴포넌트 간의 상태를 트리 구조로 관리하며, 액션(Action)과 리듀서(Reducer)를 .. front/React 2023. 4. 26.
[React] Context-API로 전역 상태관리하기 Context API란? 리액트에서는 컴포넌트 간 데이터를 전달할 때, props를 사용합니다. 하지만 데이터가 깊은 구조로 중첩되어 있거나 여러 컴포넌트를 거쳐야 할 경우, 상위 컴포넌트에서 하위 컴포넌트로 매번 props를 전달해주는 것은 비효율적입니다. 이를 해결하기 위해 리액트에서는 Context API를 제공합니다. Context API를 사용하면 전역적으로 데이터를 관리할 수 있으며, 컴포넌트 간의 데이터 전달을 간편하게 할 수 있습니다. 사용 예제 다음은 todo-app에서 Todo CRUD 네트워크 통신하는 코드를 class로 묶어서 분리하고 해당 클래스의 메서드를 전역적으로 사용하기 위한 코드입니다. 다음과 같은 Todo 클래스의 메서드를 전역적으로 사용하기 위해 Context API를 .. 카테고리 없음 2023. 4. 10.
반응형