ReduxJS/Toolkit
posted in javascript on • by Wouter Van Schandevijl •
reduxjs/redux-toolkit
:
The official, opinionated, batteries-included toolset for efficient Redux development
We’re 2025 and you start a new app with old, trusted and deprecated create-react-app
,
only to find out that using Redux is also, deprecated.
During previous migrations I took a long hard look at the ReduxJS/Toolkit documentation and I was like… Aint nobody got time for that!
For the last migration, I decided to give it go and well, I can already say with conviction, it is worth the time learning. Reduced boilerplate, batteries included and while the full documentation is still daunting, you can take it step by step.
Immer
immerjs/immer
:
Create the next immutable state by mutating the current one
Before we actually start with ReduxJS/Toolkit (RTK), let’s take a step back.
The application I was migrating, was using ImmutableJS
because you know, you want all store state to be immutable, your reducers pure, and it was all the rage back then.
For me though, the cure turned out to be worse than the disease. You could not longer just
do state.someProp
, you had to do state.get('someProp')
.
I rather just ...spread
all the way instead.
Immer is the solution the ReduxJS/Toolkit has adopted and I love how it allows you to write reducers while (almost) not having to think about immutability anymore!
createSlice and configureStore
Okay, now that we’re Immer experts, let’s look at the two most important
exports of the Toolkit: createSlice
and configureStore
.
createSlice
: each top level object of your state is typically a sliceconfigureStore
: abstracts away the horror that wascreateStore
Part 2: createSlice and configureStore
createAsyncThunk
On top of the included redux-thunk package, createAsyncThunk
is the helper function for
all your API call needs.
Coming from “legacy Redux”, this is the last basic piece of ReduxJS/Toolkit!
TypeScript
Keeping everything entirely type-safe.
Not yet written
Parts of this series that are not yet written 😀
Reselect
More batteries included.
Part 5: createSelector
RTK Query
A much higher level of abstraction.
Part 6: createApi
And more?
Listener middleware? EntityAdapters? What is Redux & Redux best practices?