This is the sixth and final part in a series on Redux, a state Management Framework used with single page application frameworks such as React and Angular. This series looks at using Redux without another framework. Please read part 1, Part 2. and Part 3, and part 4, and part 5 before reading this.

I write a lot more about Redux and Angular in the bonus book to the Angular 6 series.

In the previous sample we split up the reducer and manually called our sub reducer functions. Our reducer function was this:

view plain print about
1function reducer(state = initialState, action) {
2 return {
3 helloUser: helloUser(state.helloUser, action),
4 goodbyeUser: goodbyeUser(state.goodbyeUser, action)
5 }
6}

Redux provides a short hand to make that happen in the form of a combineReducers() function. Replace the reducer with this:

view plain print about
1reducer = Redux.combineReducers({
2 helloUser,
3 goodbyeUser
4})

Redux will automatically know how to combine these reducers. Try the app again, and you'll find that it works.

Try the app again.

I hope you enjoyed my series on Redux. Be sure to check out the full book series for an in depth explanation of how Redux and Angular can work together.