Blog>
Snippets

Using createAction and createReducer to Simplify Redux Code

Provide a code example on how to use the createAction and createReducer functions from Redux Toolkit to streamline the Redux logic.
import { createAction, createReducer } from '@reduxjs/toolkit';

// Define action creators using createAction
const increment = createAction('counter/increment');
const decrement = createAction('counter/decrement');
Creates action creators for incrementing and decrementing a counter using the createAction utility.
const initialState = { value: 0 };

// Define a reducer using createReducer
const counterReducer = createReducer(initialState, {
  [increment]: (state, action) => {
    state.value += 1;
  },
  [decrement]: (state, action) => {
    state.value -= 1;
  }
});
Defines a reducer for the counter with initial state and handler functions for increment and decrement actions.