redux-toolkit
The official, opinionated, batteries-included toolset for efficient Redux development
Redux Toolkit is the official, batteries-included way to manage shared app state in JavaScript and TypeScript projects, cutting out the repetitive boilerplate that plain Redux requires.
Redux Toolkit is the official, recommended way to write Redux code in JavaScript and TypeScript applications. Redux is a library for managing application state in a predictable way, commonly paired with React. Writing Redux by hand traditionally requires a lot of repetitive setup. Redux Toolkit was created to address three specific problems the Redux team heard repeatedly: store configuration is too complicated, too many packages are needed before Redux does anything useful, and there is too much boilerplate.
The package includes utilities that cover the most common Redux patterns. configureStore sets up a Redux store with sensible defaults and automatic integration with the Redux DevTools browser extension. createSlice combines action and reducer definitions into one function, cutting repetition considerably. createAsyncThunk handles the common pattern of making an API call and tracking whether it is pending, resolved, or failed. createEntityAdapter provides standard patterns for storing and accessing lists of items in the state. The package also includes createSelector from the Reselect library for computing derived state efficiently.
An optional but substantial addition is RTK Query, which handles data fetching and caching. You define an API with its endpoints, and RTK Query generates hooks your components can use directly. It manages loading states, caching, invalidation, and re-fetching, removing the need to write that logic by hand.
For new projects, the recommended starting point is the official Redux Toolkit Vite template or the Next.js with-redux example. For existing projects, the package installs from npm. Full documentation, including API references and usage guides, is at redux-toolkit.js.org.
Where it fits
- Replace hand-written Redux boilerplate in a React app using createSlice and configureStore.
- Fetch API data and track loading and error states automatically with createAsyncThunk.
- Build a complete data-fetching and caching layer for your app using RTK Query without third-party tools.
- Compute derived values from your Redux store efficiently with createSelector.