Redux Principles

Raushan Kumar — Tue, 08 Sep 2020 17:55:08 +0000

Redux is a predictable state container. It stores the state of your application. It stores and manages the application state.

In redux, all state transitions are explicit and is possible to keep track of them.

Basically, there are three principles of redux:

1. First Principle:

"The state of your whole application is stored in an object tree within a single store"

Maintain our application state in a single object which would be managed by the Redux store.

example:
Let's assume we are tracking the number of ice-cream at the ice-cream parlor

{
   numberOfIceCreams: 10
}

2. Second Principle:

"The only way to change the state is to emit an action, an object describing what happened"

To update the state of your app, you need to let redux know about that with action.

example:
Let the shopkeeper know about action - 'BUY_ICECREAM'

{
   type: BUY_ICECREAM
}

3. Third Principle:

"To specify how the state tree is transformed by actions, you write pure reducers"

Reducers - (prevState, action) => newState

example:
Reducer is the shopkeeper.

const reducer = (state, action) => {
   switch(action.type) {
     case BUY_ICECREAM:
        return {
           numberOfIceCreams: state.numberOfIceCreams - 1
         }
     }
}

Thank You, Happy Coding!!

Forem: Raushan Kumar

Redux Principles

1. First Principle:

2. Second Principle:

3. Third Principle:

React-Redux Learning Resources