Redux Fundamentals, Part 6: Async Logic and Data Fetching

Last Updated on May 6, 2022 by Pupli

  • Redux middleware were designed to enable writing logic that has side effects
    • “Side effects” are code that changes state/behavior outside a function, like AJAX calls, modifying function arguments, or generating random values
  • Middleware add an extra step to the standard Redux data flow
    • Middleware can intercept other values passed to dispatch
    • Middleware have access to dispatch and getState, so they can dispatch more actions as part of async logic
  • The Redux “Thunk” middleware lets us pass functions to dispatch
    • “Thunk” functions let us write async logic ahead of time, without knowing what Redux store is being used
    • A Redux thunk function receives dispatch and getState as arguments, and can dispatch actions like “this data was received from an API response”