why start i use redux toolkit? why not classic redux?

Published: (March 17, 2026 at 01:32 PM EDT)
2 min read
Source: Dev.to

Source: Dev.to

Introduction

When I first started learning Redux, I thought the boilerplate was just how things worked. Managing a simple feature required:

  • Action types
  • Action creators
  • Reducers
  • Store configuration

At first it felt “professional”, but after a few days it became repetitive and exhausting.

Problems with Classic Redux

For a single feature I was jumping between multiple files:

  • actions.js – writing constants and functions
  • reducers.js – writing switch cases
  • store.js – configuring the store

The same patterns repeated across the codebase, making even small state updates feel heavyweight.

Redux Toolkit: A Modern Approach

Redux Toolkit (RTK) removes unnecessary complexity while keeping Redux’s power. Two core functions changed my understanding completely: configureStore and createSlice.

configureStore

Classic Redux

import { createStore, combineReducers, applyMiddleware } from 'redux';
const store = createStore(
  combineReducers({ /* reducers */ }),
  applyMiddleware(/* middleware */)
);

Redux Toolkit

import { configureStore } from '@reduxjs/toolkit';
import rootReducer from './reducers';

const store = configureStore({
  reducer: rootReducer,
});

All internal setup (middleware, DevTools integration, etc.) is handled automatically.

createSlice

Classic Redux

// action types
const INCREMENT = 'counter/increment';

// action creators
export const increment = () => ({ type: INCREMENT });

// reducer
export default function counterReducer(state = { value: 0 }, action) {
  switch (action.type) {
    case INCREMENT:
      return { ...state, value: state.value + 1 };
    default:
      return state;
  }
}

Redux Toolkit

import { createSlice } from '@reduxjs/toolkit';

const counterSlice = createSlice({
  name: 'counter',
  initialState: { value: 0 },
  reducers: {
    increment(state) {
      state.value++;
    },
  },
});

export const { increment } = counterSlice.actions;
export default counterSlice.reducer;

createSlice automatically generates action creators and the reducer, replacing three to four separate pieces of code with a single, concise definition.

Migration Strategy

You don’t need to switch everything at once. Classic Redux and Redux Toolkit can coexist in the same project, both connecting to React in the usual way. This allows a gradual migration without pressure.

Conclusion & Advice

Understanding Redux Toolkit makes Redux feel simple and practical:

  • Less boilerplate
  • No switch statements scattered across files
  • All related logic lives together

If you’re learning Redux now, don’t stop at classic Redux. Start with Redux Toolkit early—it will save you time, energy, and a lot of confusion.

0 views
Back to Blog

Related posts

Read more »

Stop Rewriting This React Form UX Logic

markdown !Cover image for Stop Rewriting This React Form UX Logichttps://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/ht...

Equity in Motion

🎨 From Bias to Balance — A Frontend Story of Gender Equity 💡 Concept - Breaking systemic bias - Equity over equality - Rising together 🚀 Code javascript imp...