Why Redux?

Redux is used with many different libraries as a state management tool, such as React, Vue.js, Angular, etc.

In React, if we need a state shared between multiple components, we can create one common parent component. Initiate the states there and pass them as props downwards:

Though this method can sometimes be tedious, the code can become a bit messy if we have many components and states to manage. This is where Redux can be used to organize things more.

One of the key concepts in Redux is that the state of your entire application is stored in a single immutable store. Since the store is directly immutable, we dispatch actions, which are then handled by reducers that modify the store. This process is a one-sided data flow, and it has a few advantages:

• It makes it easy to understand the state of your application since all the states are stored in a single location;
• It makes it easier to debug your application since you can use Redux Dev Tools to see the history of Redux actions that have been dispatched and the corresponding state changes;
• It makes it easier to test your application because you can use actions and reducers to specify the behavior of your application.