Redux is a container for Javascript applications, primarily used with libraries/frameworks like React, Angular or Vue.
Core Concepts of Redux
- Source of Truth: The entire state of an application is stored in a single Javascript object within a centralised store.
- State is Read-Only: The state in Redux is Immutable which means it can’t be changed. The only way to change the state is by dispatching actions.
- Changes are made functions: Reducers are functions that specify how the application’s state changes in response. They take the previous state and an action, and return the next state.
Key Components of Redux
- Store: The store holds the complete state tree of your application. It allows access to state via getState(), updates state via ‘dispatch(action)’ and listens to changes via ‘subscribe (Listner)’.
- Actions: Actions are payloads of information that send data from your application to the store. They are plain Javascript objects with a type of property that describes the action.
- Reducers: Reducers specify how the application’s state changes in response sent to the store. They are function that take the previous state and an action and return the next state.
Also Redux acts as a middleware and allows for handling asychronous actions, logging, routing e.t.c.
Redux also offers browser extensions like Redux Dev Tools for Inspecting and debugging Redux applications.
In Summary, Redux provides a clean architecture for managing application in state management for Javascript applications. Its core principles makes it an excellent choice for managaing complex state in larger applications.
Here’s a snippet of the code:
