While preparing my upcoming Pluralsight course “Managing React State”, I found a surprising number of React state management options.
This slide from the upcoming course summarizes eight ways to handle state in React apps:
Throughout the course, I build a realistic shoe store that implements each of these 8 options.
However, that’s just a general list of approaches. When you consider how to implement the options above, there over 30 options consider:
Built into React
Class state
useState
useReducer
context/useContext
refs/useRef
Remote state
Form state
formik
react-hook-form
react-form
react-final-form
URL / location state
General state
Redux
Flux
Mobx
Recoil
XState
Unstated
mobx-react-lite
easy-peasy
overmindjs
react-easy-state
Effector
freezer
Undux
Zustand
react-sweet-state
Statux
See something I’m missing? Please reply on this GitHub issue.
Curious how these compare? Check out React State Museum.