Redux Fundamentals
May 12, 2021•189 words
When I first started using React, I thought it was great how separation of components was by design. Unfortunately, this also meant that sharing state is a huge pain in the butt. Fortunately, the good people at Facebook created a design pattern called Flux that is the functional programming equivalent of having a global store.
Redux takes Flux to another level. Instead of having multiple stores, applications using Redux are limited to just one. The Redux store has three main properties.
State
The Redux store contains state that can be of any type. It can hold simple strings or numbers but is usually a complex object containing different types.
Dispatch
The only way to update the Redux store is to call the store's dispatch method. Instead of having multiple APIs, all state change is made via the same dispatch method. When calling dispatch, you provide a custom action object and under the covers a reducers handles the state change.
Reducers
Reducers are functions that know how to update the state given an action. Reducers take the current state and an action and return the new state.