React Combining Reducers

In this tutorial, you will learn about how we can have separate reducers managing parts of the state, and how they can be combined together to manage the whole state. At the end of this tutorial, you will be able to:

  • Implement reducers that are responsible for only part of the state
  • Combine the reducers to manage the entire state

Splitting the Reducer

  • In the redux folder, create a new file named dishes.js and add the following to it:
  • Then, create a file named comments.js and add the following to it:
  • Similarly, create a new file named promotions.js and add the following to it:
  • And finally, create a new file named leaders.js and add the following to it:
  • Now that we have split the management of state into different reducers that manage partial state, we need to combine them together. Open configureStore.js and update it as follows:
  • Now we can safely delete the reducer.js file from the project.

(source: Front-End Web Development with React on Coursera)