Redux란?
Redux란 Javascript App을 위한 예상가능한 상태 관리 컨테이너로 리액트의 상태를 전역으로 관리할 수 있도록 도와 줍니다. 컴포넌트간 공용으로 쓰이는 상태들이 멀리 떨어져 있거나 리액트만으로는 해결할 수 없을 때, 최후의 방법으로 사용하는 것이 권장됩니다.
Flow
기존의 MVC 모델에서는 Model과 view간의 인터렉션이 빈번하게 발생하기에 업데이트를 파악하는 과정이 매우 복잡합니다.
MVC의 단점에 대한 해결책으로 Flux design pattern이 등장하였다. 폭포수 모형과 같이 일자식의 패턴이기에 예측이 훨씬 쉬워진다.
3 Redux Principle
- 모든 상태는 store에서 1개의 객체 트리구조로 저장된다.
- state is read-only
- Reducer는 순수함수 여야 한다!!
순수함수
동일한 인자에 대해 같은 값을 반환하는 함수로써 함수내부, 외부의 값을 변형시키는 경우, new Date( ), random함수 같은 경우는 같은 인자에 대해 다른 값을 반환할 수 있기에 순수함수가 아님.
용어정리
(1) Action
특정 상태를 나타내는 일반 Javascript 객체형식으로 type이라는 key를 가진다. 통상 action Creator라는 함수를 같이 만들어 준다.
(2) Dispatch
(1)의 action을 store로 전달하는 store의 함수
(3) reducer
dispatch된 action 객체를 받아서 결과를 반환하는 순수함수로 store의 state를 변화시킨다.
추가적으로 각각의 관심사로 나뉘어진 reducer 하나하나를 sliceReducer라고도 부른다.
(4) store
state가 저장되는 곳이며 store.getState( )로 객체 형태로 저장된 state를 확인할 수 있다.
Reference
(1) https://medium.com/@jsh901220/react에-redux-적용하기-a8e6efd745c9
