While developing web applications, we built many components and having a data model across the application wide model will be difficult. We need common store management to update and get information across all the components. In React based Web UI, redux is the official centralized state management to be used, which is internally wired as state changes to the component. There are other alternatives to redux which are light-weight and simple to use. One among them is Jotai, a minimalistic API for state management. In this blog, we will take one of the redux examples given in the redux site and do the same in Jotai for deeper understanding.
Shopping Cart Example (Redux):
Redux is a pattern and library for managing and updating application state, using events called "actions". createStore helps to create a centralized store for managing the data model and applying actions or using selectors by the component. It also uses middleware to create logger statements. Store dispatch the actions or rules which takes the state and action and returns the state for the components to use.
const store = createStore (
reducer,
applyMiddleware(...middleware)
)
store.dispatch(getAllProducts())