From e321ca535c9651c2c02ff9601b5e94af341d6fe1 Mon Sep 17 00:00:00 2001 From: Colin Crawford Date: Sat, 13 Oct 2018 03:35:39 -0400 Subject: [PATCH] Add first content on redux middleware (#18643) * Add first content on redux middleware Add a description of what redux middleware is, some examples of what it can be used for, and how to add it to your app. * fix: formatting --- .../english/redux/redux-middleware/index.md | 21 +++++++++++++++---- 1 file changed, 17 insertions(+), 4 deletions(-) diff --git a/client/src/pages/guide/english/redux/redux-middleware/index.md b/client/src/pages/guide/english/redux/redux-middleware/index.md index 5a217372c4..583ddbd77c 100644 --- a/client/src/pages/guide/english/redux/redux-middleware/index.md +++ b/client/src/pages/guide/english/redux/redux-middleware/index.md @@ -3,13 +3,26 @@ title: Redux Middleware --- ## Redux Middleware -This is a stub. Help our community expand it. +One of the great things about redux is that it provides an interface to plug in different middleware packages to add additional functionality to redux. Redux middleware basically acts like pipes that your actions will flow through after getting dispatched but before being handled by your reducers. There are a large amount of popular redux middleware packages for adding features like logging and handling asynchronous action flows. -This quick style guide will help ensure your pull request gets accepted. +[Redux Thunk](https://github.com/reduxjs/redux-thunk) for example allows you to dispatch functions to delay the dispatching of actions. - +Adding middleware to redux is as simple as adding another argument when calling "createStore". Just pass the result of calling "applyMiddleware" with each middleware package you want to use. In the example below we add redux-thunk and redux-logger to our app. + +```js +import { createStore, applyMiddleware } from 'redux'; +import thunk from 'redux-thunk'; +import logger from 'redux-logger' + +const store = createStore( + rootReducer, + applyMiddleware(thunk, logger) +); +``` #### More Information: +[Middleware - Redux docs](https://redux.js.org/advanced/middleware) - +[Redux Logger](https://github.com/evgenyrodionov/redux-logger) +[Redux Thunk](https://github.com/reduxjs/redux-thunk)