Redux Toolkit

Last Updated : 2 May, 2026

Redux Toolkit (RTK) is a modern utility package that simplifies Redux development by reducing boilerplate and improving state management. It was introduced to address the complexity of traditional Redux and make store creation easier and more efficient.

  • Provides utility functions to simplify Redux store setup and logic.
  • Redux Toolkit is the official way to write Redux logic, simplifying store setup and state management.
  • Easy to install using npm commands.
  • It follows an opinionated approach to simplify common Redux patterns.

Problems solved by Redux Toolkit (RTK) in Redux

Redux Toolkit was created to solve these three common problems that we face in Redux.

  • Too much code to configure the store.
  • Writing too much boilerplate code to dispatch actions and store the data in the reducer.
  • Extra packages like Redux-Thunk and Redux-Saga for doing asynchronous actions.

Check this article to know Why Redux Toolkit is preferred over Redux.

Steps to Install and Import Redux Toolkit(RTK)

Redux Toolkit is added to a React project to simplify state management with less boilerplate. After installation, you import its core utilities, create a centralized store with slices, and connect it to your app using a provider.

Step 1: Redux Toolkit (RTK) Installation

To install the redux toolkit in our project type the following command in the terminal.

// RTK Installation
// using NPM
npm i @reduxjs/toolkit
npm i react-redux        // Used to connect React components with the Redux store
// using Yarn
yarn add @reduxjs/toolkit

Step 2: Importing Redux Toolkit (RTK)

We import only the necessary functions in our code

// Importing 
import { configureStore } from '@reduxjs/toolkit';        // Creates a store
import { createSlice } from '@reduxjs/toolkit';              // Combines and creates reducer

Dependencies after installing the Redux Toolkit:

"dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "@reduxjs/toolkit": "^1.6.1",
    "react-redux": "^7.2.5"
  }

Benefits of Redux Toolkit (RTK)

Redux Toolkit (RTK) is the modern, official way to use Redux for state management in applications. It simplifies complex Redux patterns while improving code readability and maintainability.

  • Easier and more intuitive state management compared to traditional Redux.
  • Significantly reduces boilerplate code.
  • Provides built-in wrapper functions like slices and reducers.
  • Officially recommended standard approach by the Redux team.
  • Improves scalability and consistency in large applications.

Important function provided by Redux Toolkit

Redux Toolkit provides several utility functions that simplify traditional Redux development.

  • configureStore(): Replaces the basic Redux createStore function and automatically sets up middleware and DevTools support.
  • createReducer(): Simplifies reducer logic and makes the code shorter and easier to understand.
  • createAction(): The createAction() utility that returns an action creator function.
  • createSlice(): Combines reducers and action creators into a single function.
  • createAsyncThunk(): Simplifies asynchronous logic by automatically handling promise lifecycle states such as pending, fulfilled, and rejected.
  • createEntityAdapter(): Helps manage normalized state structures like lists of users or posts.

Difference between Redux and Redux Toolkit

Here are the key differences between Redux and Redux Toolkit:

Redux

Redux Toolkit (RTK)

Redux often required writing a significant amount of boilerplate code, such as action creators, reducers, and store setups.

Redux Toolkit is designed to minimize boilerplate code. It includes utilities like createSlice for reducers and configureStore for store configuration, reducing the amount of manual setup required.

Reducers are typically created using a switch statement, handling various action types explicitly.

With createSlice from the Redux Toolkit, reducers can be defined more concisely using a "slice" of the state and auto-generated action creators.

Redux requires manual immutable updates, usually done via spread operator or helper libraries

It encourages immutability by providing utility functions immer internally, allowing more straightforward state updates within reducers.

Setting up the Redux store involves configuring middleware, combining reducers, and applying additional enhancements.

configureStore From Redux Toolkit simplifies store configuration by integrating commonly used middleware and providing a more streamlined setup.

Handling asynchronous actions requires additional middleware, like redux-thunk or redux-saga.

createAsyncThunk Is included in the Redux Toolkit which simplifies the process of managing asynchronous actions within the Redux store.

It may have a steeper learning curve due to the amount of boilerplate code and manual configuration.

It is designed to improve developer experience by reducing boilerplate, making it more accessible and efficient, especially for beginners.

Comment

Explore