리액트 - 리덕스의 흐름

반응형

리덕스의 흐름

액션 → 스토어 전달 → 리듀서에서 액션타입에 따른 payload 전달 → 상태 변경

  • 위 흐름은 동기적 으로 일어나는데 만약 실제 서버와 통신하며 API 같은 외부 리소스를 가져오는 경우에는 리덕스 흐름만으로는 제어하기가 어렵다고 한다.
  • 그래서 리듀서 단계 전이나 마지막인 액션에서 스토어 상태 변경 전에 비동기 로직을 넣을 수 있는데 이를 미들웨어(middleware)라고 한다고 한다.

(출처: https://binaryjourney.tistory.com/11?category=916264)

미들웨어

  • 대표적인 미들웨어로는 redux-thunk, redux-saga가 있다.

리덕스 툴킷

  • createAction
  • createSlice

위 둘은 리듀서를 한 파일에서 쉽게 만들고 활용하기 위해서 사용한다고 한다.

yarn add redux react-redux react-router-dom redux-saga @reduxjs/toolkit antd

yarn add redux-logger axios

반응형