Redux Basic Indroduction

1. What is Redux?

Redux is a predictable state container for JavaScript application. The state of your application is kept in a store, and each component can access any state that it needs from this store.

2. Why is Redux?

Most libraries like React, Angular, etc. are built with a way for components to internally manage their state without any need for an external library or tool. It does well for applications with few components, but as the application grows bigger, managing states shared across components becomes very hard.

3. How Redux works?

const store = createStore(mathsReducer, 1);
  • After that new state is stored in the store.
  • subscribe method inform that state is changed.
store.subscribe(() => {console.log("Store updated", store.getState());});

4. Multiple reducers

Here we are going to use multiple reducers. Redux is support for multiple reducers. Here we are using combineReducers from redux library.

5. Redux Middleware

Middleware is executed before handling the action(before state is changed).

6. Redux Logger

In redux, there is nice user friendly logger called “redux-logger”. It is also library.

References

https://blog.logrocket.com/why-use-redux-reasons-with-clear-examples-d21bffd5835/