Back to business and the first thing we will be learning about is called Redux. Anyone who build UIs with JavaScript will come across problems with handeling state of the app where you have to update one thing in one place but it must be update everywhere else it is used.
For example when building a user authencation in UIs we have to make sure that the user must not get what he/she does not have access to and to do that we have to know who is autheticated and what they have access to at and this information must be available to all the components of the app and must be updated everytime and everywhere. That is why state management is so important.
When working with JS frameworks like React and Angular we need some way to manage state in all parts of the app. React have Context Hook but there is more powerful way to manage state in React and other frameworks. This is by using Redux.
What is Redux?
Redux is a State Management Library. It can be used with any JS framework not just with React and even with Vanila JS projects to manage state of the application. Redux uses a Store to store all the properties of an application. Its the single source of truth for the app and will be updated everytime a property inside the store is updated.
But why use Redux?
- Predictable state changes
- Centralized state
- Easily Debugable with Redux DevTools
- Large ecosystem of addons and tools
- Works with all JS Frameworks and Vanila JS
- And many more
Installing Redux
To get started with Redux first you have to install it and to do so we use npm.
Linux >> npm install redux
But this will install the redux core library and to use it in react project we have to install the react bindings for redux as well.
Linux >> npm install redux react-redux
Next we will be looking at the core concepts of Redux.