Global state management with Redux
Redux is a great library for global state management. While some might say that global state is a bad thing, it is not entirely possible to move away from the global data, especially items such as authentication and authorization information, site settings and preferences, and so on.
While Redux can be used as a standalone library, it is often paired with React via react-redux library. In this library, there is Provider helper class that connects the Store with the app itself. Once it's wired-in, you can then use a higher-order-function connect to map component state and to dispatch component updates.
Key Redux component is Central Store. This store keeps entire application state. Components within your application should be able to manipulate this state, but we need a predictable and reliable process to manage it.
In Redux this process is enforced by Actions and Reducers. Components can dispatch Actions to initiate the state change. Actions don't do any real work, they are just indicators of what change was requested. It's Reducer's job now to react to the actions. A Reducer is nothing more than a pure function that receives the action and knows how to update state. One catch is that in Reducers make all changes immutably. Don't do ++, return a new object with a new value instead! After the state has been updated, we need to notify our component about the change. For this we use Subscriptions.
While Redux can be used as a standalone library, it is often paired with React via react-redux library. In this library, there is Provider helper class that connects the Store with the app itself. Once it's wired-in, you can then use a higher-order-function connect to map component state and to dispatch component updates.
