Chapter 14. Working with data using Redux

 

This chapter covers

  • Understanding unidirectional data flow in React
  • Understanding the Flux data architecture
  • Working with the Redux data library

So far, you’ve been using React to create user interfaces. This is the most common use case for React. But most UIs need to work with data. This data comes from either a server (back end) or another browser component.

When it comes to working with data, React offers many options:

  • Integrating with MVC-like frameworks—This option is ideal if you’re already using or are planning to use an MVC-like framework for a single-page application: for example, using Backbone and Backbone models.
  • Writing your own data method or a library—This option is well suited for small UI components: for example, fetching a list of accounts for a List of Accounts grid.
  • Using the React stack (a.k.a. React and friends)—This option offers the most compatibility (your code will integrate with less friction) and the most adherence to the React philosophy.

This chapter covers one of the most popular options for the third approach: Redux. Let’s start by outlining how data flows in React components.

14.1. React support for unidirectional data flow

14.2. Understanding the Flux data architecture

14.3. Using the Redux data library

14.4. Quiz

14.5. Summary

14.6. Quiz answers