[데브코스] TIL-133 React, Redux

1. Redux

  Redux는 Prop Drilling 문제를 해결하기 위해 등장했다. 그렇다면 Context API와 무엇이 다를까? Context API는 React의 내장 API여서 따로 설치없이 사용이 가능한 반면, Redux는 Third Party 라이브러리로 설치가 필요하다. 그리고 개발 편의를 위한 미들웨어 기능과 성능 최적화를 쉽게 해주는 기능을 제공한다.

2. 동작 방식

  Redux는 Action이 발생하면 Reducer를 호출하고 Reducer를 통해 store에 상태를 저장한다. store가 변경되면 다시 view를 리렌더링한다. Context API에 useReducer를 사용한 것과 유사하다.

3. 3가지 원칙

1. 진실은 하나의 근원으로부터
2. 애플리케이션의 모든 상태는 하나의 저장소 안에 하나의 객체 트리 구조로 저장된다. Context API는 변경이 발생하면 모든 Consumer를 리렌더링 하지만, Redux의 경우에는 사용한 부분만 리렌더링 되도록 최적화하고 있다.
3. 상태는 읽기 전용
4. 개발자가 직접 상태에 접근하여 변경할 수 없고, 반드시 Action을 통해 Reducer를 실행하고 Reducer가 상태를 변화하도록 만들어야 한다.
5. 함수는 순수 함수로 작성
6. Reducer 안에 네트워크 로직이 들어가서는 안된다. Reducer를 재사용 가능하게 만드는 원칙 중 하나라고 볼 수 있다.

 

오늘을 마무리 하며

 

  오늘은 전역 상태 관리 라이브러리인 Redux에 대해서 공부를 하게 되었다. 근데 공부를 하면서 느낀점은 그냥 뭐가 너무 복잡하다는 생각이 들었다. 전역 상태로 관리하는 값들은 최소화해야 하는데 최소화한 값을 전역 상태로 관리하기 위해서 라이브러리를 설치하고 또 복잡한 문법들을 사용해서 관리해야 한다는 것이 뭔가 어색한 느낌이 들었다. 아직 Recoil에 대해서는 구체적으로 보지는 못했지만, 앞으로 프로젝트를 진행할 때 전역으로 상태를 관리하는 상황이 올 텐데, 그 전에 contextAPI vs Redux vs Recoil을 잘 비교해보고 선택해서 적용해보는 연습을 해볼 예정이다!