PREREQUISITES

To understand redux it is advised that you must know the basics of** react**. If you don't know the basics of react. So please don't proceed because it is not going to help you and also doesn't try to learn them together.

Before you start I want you to know that nowadays redux Toolkit is used instead of** redux**. But learning about redux helps to understand the redux toolkit.

What Is Redux?

Redux is a predictable state container for JavaScript Apps. Well, this is the definition from the official documentation. But what does it mean? Let's try to understand each term separately.

Redux is for JavaScript Apps?

yes, you read that write. Redux is not bound to react only. It can be used with any other library as Angular or Vue or even VanillaJs. But it is advised to use** Redux with React** as Dan Abramov created redux especially to use it with React.

Redux is a State Container?

Redux can **store **all the **states **of your App. So State of an App is the state represented by all the individual components of the App.

Redux is predictable?

So **predictable **here means as redux stores the state of your application. It keeps track of all the changes caused by any **action **and so it updates the state. So redux knows what every action will do and how the state will change. So in this way, Redux is Predictable.

Why use Redux?

In a big react app, you are going to have multiple components and multiple states. It becomes hectic to manage all these states easily.

Look at the above tree and consider. Suppose you had select category options in component C. User selects a category in C and you want to display the selected category in component A. How are you going to do that? You will pass the state from C to D and then From D to E and then E to A all via using props. what if you want to pass the state from C to M?

You can guess how hectic it becomes to **manage **only one state and also many components are going to have those state which does not even require them like E or N for example. In a big app, you are supposed to manage multiple states and you can imagine how tough it becomes. So for all this Redux is the solution. But how does redux solve this?

With redux, we have a global store that is not used to pass through components as without redux. We will store all the states inside this and only the component that needs to access states from the tree can access and can also update the state.

React -redux and redux are same?

The answer is no. So we know React is a JavaScript framework and on the other hand** Redux is a state management tool**. Both of them are independent of each other. Using Redux directly in React is confusing and hectic. So to use redux in react in a simple manner we use react-redux which is a package that binds both of them and makes it easy for us to use redux in react.

Redux is the only state management tool?

No, redux is not the only state management tool. They are more like Mobx and Context API. But react is still used to be popular.