introduction to redux store component code example

Example: redux

Redux is a state management library
1 Create Initial State
2 Define Action Types
3 Define Action Creators
4 Create Reducers
5 Change the initial State
6 Pass the parameters to the Creator function and the reducers

Code
// Initial State

const initialState = {
  todos: [
    {
      text: "eat food",
    },
    {
      text: "Exercise",
    },
  ],
};

// Action Types
// create a simple action type

const ADD_TODO = "ADD_TODO";

// ACtion creators

function addTodo(text) {
  return {
    type: ADD_TODO,
    payload: text,
  };
}

//create reducers
function todoReducer(state = [], action) {
  switch (action.type) {
    case ADD_TODO:
      return [...state.todos, { text: action.payload }];
    default:
      return state;
  }
}

console.log("Initial State : ", initialState);

// Lets make changes to initial states
const action = addTodo("Make it work");
const newState = todoReducer(initialState, action);

console.log(newState);