Understanding Redux Middleware

Abudu Abiodun Sulaiman
May 16 · 2 min read

Middleware

Express middleware

Redux Middleware

Note: All these happen within the store( the redux single source of truth). Every middleware has next() that calls the next action in the line.
Note: In the left-hand side of the above screenshot, the store dispatches an object ({type: “SOME_EVENT}) while in the right-hand side, the store dispatches a function (() => {}).

ApplyMiddleware

Note: the applyMiddleware enhancer applies middlewares(c, d and others) to the store dispatch function

Snippet of Code

import { createStore, applyMiddleware } from 'redux'
import rootReducer from './reducers'
import reduxLogger from 'redux-logger'
import reduxThunk from 'redux-thunk'

const store = createStore(rootReducer, applyMiddleware(reduxLogger, reduxThunk))

Chingu

Join our friendly community's mission to create a collaboration & opportunity hub for tech-learners! Developers | Designers | Data Scientists

Thanks to Fred Adegoke.

Abudu Abiodun Sulaiman

Written by

Chingu

Chingu

Join our friendly community's mission to create a collaboration & opportunity hub for tech-learners! Developers | Designers | Data Scientists