Middleware와 thunk

redux를 사용 하면서 비동기 작업 (예: 네트워크 요청) 을 다룰 때에는 미들웨어가 있어야 더욱 손쉽게 상태를 관리 할 수 있다.

우선, 미들웨어가 어떤 역할을 하는지, 그리고 어떻게 작동하는지 이해를 해보자.

미들웨어(Middleware) 이해하기 ❗

Action이 dispatch 되어서 Reducer에서 이를 처리하기 전에 사전에 지정된 작업들을 설정한다.

미들웨어를 액션과 리듀서 사이의 중간자라고 이해하면 된다.

Thunk ❗

Thunk는 Redux의 미들웨어로서, Action Create를 작성하면 Action 대신에 함수가 반환되게끔 할 수 있다.

또한, Action을 dispatch 할 때, delay를 줄 수 도 있고, 아니면 특정한 조건이 만족되면 디스패치 할 수 있는 기능도 있다.

그리하여 내부 함수에서 dispatch, getState와 같은 메소드를 매개변수로 받을 수 있다.

Thunk는 Store에 대한 접근이 필요한 복잡한 동기식 논리, AJAX 요청과 같은 단순한 비동기식 논리 등 기본적인 Redex 논리에 권장되는 미들웨어다.

---

---

references

리덕스 미들웨어, 그리고 비동기 작업 (외부데이터 연동)

reduxjs/redux-thunk