Using Reducer Hooks

After learning about actions, reducers, and the Reducer Hook, we are going to use it in our blog app. Any existing State Hook can be turned into a Reducer Hook when the state or state changes become too complex.

If there are multiple setState functions that are always called at the same time, it is a good hint that they should be grouped together in a single Reducer Hook.

Global state is usually a good candidate for using a Reducer Hook, rather than a State Hook, because changes to it can happen anywhere in the app. It is much easier to deal with state changes when they only get processed in one function and the components dispatch actions instead of directly modifying the state. Having all the state-changing logic in one place makes it easier to maintain and fix bugs, without introducing new ones by forgetting to update the logic everywhere.

Turning a State Hook into a Reducer Hook

In our blog app, we have two global State Hooks:

...