본문 바로가기

React/Redux

Redux - Middleware

 

리덕스 미들웨어는 액션에서 리듀서로 가기 전에 데이터를 한번 더 처리할수 있게 해주는 리덕스 기능이다. 리덕스가 다른 상태 관리 라이브러리들과 차별점을 가지는 부분이기도 한데, 미들웨어를 이용해서 여러 부가적인 설정들을 넣어 더 복합적이고 다채로운 액션을 처리할 수 있다.

 

예를 들어, 어떤 액션이 디스패치 되었을 때, 상태를 통해 판단한 후 액션을 디스패치할지 말지를 결정시킨다던지, 비동기 작업을 전처리 한다던지, 새로운 액션을 디스패치 시킨다던지 같은 작업들을 처리할 수 있다.

 

리덕스 미들웨어는 주로 비동기 작업을 처리할 때 사용된다. 가령 API 요청 후에 새로운 페이지로 리디렉트 시킨다던지, 등등.

 

리덕스는 미들웨어 함수는 이런식의 템플릿을 갖고 있다.

위 템플릿은 아래와 같은 뜻이다.

즉 함수를 반환하는 함수를 반환하는 함수가 미들웨어인 것이다. 스토어라는 인수를 받아온 후. 그것을 next를 인수로 받는 함수에 보낸 후, 다시 그 함수를 action을 인수로 받는 함수로 받아 처리하는 것이다. 굉장히 복잡한 구조인 것 처럼 보이지만, 실제는 아래와 같이 실행된다.

next 는 미들웨어에서 액션을 받아왔을 때, 다음 미들웨어를 발동시키는 함수이다. 우리는 여러 미들웨어들을 쓸 수 있는데, 만약 next 에서 액션을 무시하는 함수가 들어있다면, 액션이 디스패치 되더라도 리듀서까지 도달하지 못하기 때문에, 스토어에 상태변화가 일어나지 않는다.

 

 

'React > Redux' 카테고리의 다른 글

Redux-saga - Promise 작업 처리  (0) 2020.07.07
Redux-saga - 기본  (0) 2020.07.07
Redux-saga - Generator 문법  (0) 2020.07.07
Redux-thunk  (0) 2020.07.06