API Middleware

Let’s see why we need a communication middleware and understand what problems it addresses.

A quick glance at the previous two action creator examples reveals that there are only two differences between the functions: the URL and the action that gets dispatched when data is successfully fetched.

In the spirit of generality, we can create an abstract layer to handle network requests and only pass it the url and onSuccess parameters. But using a shared function or library does not fully solve all the problems mentioned earlier. Our action creators will still be asynchronous, which means they’ll be harder to test and more difficult to debug using the regular Redux debug flow of monitoring all actions dispatched to the store.

Get hands-on with 1200+ tech skills courses.

Introduction to Redux

Basic Redux Implementation

Cloning a Redux Boilerplate

Complete Redux Project

Creating a Store

Decorating the Store

Actions and Action Creators

Redux Thunk

Redux-Actions Library

Reducers

Avoiding Mutations

Introduction to Middleware

Your First Middleware

Middleware

State Management

Keeping a Normalized State

Persistence State

Real-World State

Server Communication

Moving Code from Action Creators

Error Handling

Server Communication II

Transforming Data

Chaining Requests

Managing Side Effects

Messaging Patterns

WebSockets

WebSocket Authentication

Testing

Testing Action Creators

Async Action Creators

Testing Reducers

Testing Middleware

Testing Async Middleware

Integration Tests

Evolution Of Redux

Final Assessment

API Middleware