Search⌘ K

Chaining Network Requests

Explore how to manage chained network requests in Redux by using middleware strategies such as redux-thunk. Understand common challenges in chaining API calls, including error handling and flow control, and see practical examples that clarify how to structure asynchronous actions for better maintainability and state management.

We'll cover the following...

Sometimes to fetch data from the server, we have to make chained API calls. A simple example might be fetching the metadata of the current user and then the user’s actual profile from different endpoints. Here’s an example using an asynchronous action creator with redux-thunk:

const fetchCurrentUser = () => dispatch =>
 axios.get(`/user`)
  .then(({ data: user }) => {
    dispatch(setUser(user));

    // Get user's profile
    axios.get(`/profile/${user.profileId}`)
      .then(({ data: profile }) => dispatch(setProfile(profile)));
    }
  );

The ...