Logo Awesome React

Awesome React

Redux Tutorial #1 - React js tutorial - How Redux Works

This Redux tutorial series will show you the schematics of a Redux application. Redux is AWESOME, but it takes a bit to get it setup. There really aren't a lot of moving parts, but there are a lot of ways that you can configure it - namely - configure the store.

Redux is like Flux in several ways, but it's different as well. It has these pieces:
- Provider: wraps your application, injecting the store
- Store: one large store that contains the state for your entire application
- Reducers: reducers listen to actions and make changes on the store values. They also cannot mutate the data on the store in any way, but must return a new set of data.
- Actions: pretty much just like flux actions, the only difference is that async can be handled in multiple different ways depending on store "middleware"
- Components: React components can be injected with various pieces of store data. React components also trigger Redux actions. This is what makes it all come together.