Use a Reducer in a Functional Component with the useReducer Hook in React

Instead of multiple useState hooks, you can use a single useReducer hook to manage multiple pieces of data in a React component.

This will feel very similar to Redux, but it will be defined for only a single component.

This can trade off some of the complexity of using multiple useState hooks, but it just moves that complexity into the reducer function - so using useReducer vs multiple useState calls is mostly just a code style choice.