Context API란?

앱의 규모가 커지고 복잡해짐에 따라 부모 컴포넌트에서 중첩된 자식 컴포넌트에게 데이터나 데이터 변경함수를 전달해줄 때, 몇단계를 걸쳐서 전달해줌으로서 애플리케이션이 더욱 복잡해지는 문제가 발생하였다.
이를 해결하기 위해 context API가 등장하였고, 이로써 props를 단계별로 넘겨주지 않아도 데이터를 제공할 수 있게 되었다. 그 결과 컴포넌트 트리로 묶인 컴포넌트 간 데이터 공유가 수월해졌다.

  • 리액트에서 제공하는 내장 기능이다.

단, Context API를 사용하게 되면 컴포넌트의 재사용이 어려워지므로 꼭 필요한 경우에만 사용한다.

Redux란?

Redux는 action이라는 이벤트를 사용하여 데이터를 관리할 수 있는 상태관리 라이브러리이다.

redux

리덕스의 3원칙

  1. 단 하나의 store에서 모든 상태가 저장된다.
  2. store의 상태를 변경하는 유일한 방법은 action 객체를 dispatch하는 방법 뿐이다.
  3. action에 의한 상태 변경은 순수함수를 통해서만 가능하도록 작성해야 한다.

리덕스 특징

  • thunk, saga와 같은 미들웨어를 추가적으로 설정할 수 있다. 비동기 처리를 Util로 처리 가능
  • Redux Devtool Extension을 사용하여 디버깅이 용이하다.
  • 전역 상태 관리 이외도 로컬스토리지에 상태 저장, 버그 리포트 등의 기능을 제공한다.

Context API와 Redux의 차이

Context API Redux
Learning Curve 쉬움 어려움
알아야 할 것들 적다 많다
유지보수성 작고 간단한 애플리케이션에 적합 복잡한 애플리케이션에 적합