redux-thunk 이해하기

Redux는 따지고 보면 큰 울타리를 Redux 라 부르고 큰 울타리 내에서 잘지내게 만들어진 여러 작은 울타리들이 있다. 

 

Redux-thunk, Redux-Toolkit, Redux-Saga 등이 그런 것들이고 이번엔 Redux-thunk를 사용해보면서 사용법을 익혀보자

 

 

npm install redux-thunk

 

redux-thunk 는 비동기 작업을 처리할 때 쓰이는 미들웨어다. 이 미들웨어를 단순히 객체만 디스패치 하는 게 아닌 함수를 디스패치 할 수 있게 된다. 

 

주로 api 콜을 하면서 데이터를 가져올 때 사용하는데 사용법은 간단하다. 

 

* dispatch 를 파라미터로 받는다.

  이게 가장 중요한 거 같다. 

 

이런 식으로 async/await 문법을 사용할 수 있으며  Action 함수 내에서 요청을 날리고 Reducer로 전달해주고 있다. 

 

store 에서도 조금씩 바꾸어주어야 할 부분이 있는데 

 

 

이런 식으로 추가해줄 부분을 추가해주면 되겠다.