O que o Redux Toolkit (RTK) oferece além do Redux clássico?

Question

IT Interview Practice · Accepted Answer

**Redux Toolkit (RTK)** é a forma oficial e recomendada de escrever Redux hoje. Ele elimina o notório boilerplate do Redux clássico — tipos de ação manuais, criadores de ação, lógica de atualização imutável, configuração de store — enquanto mantém os mesmos princípios fundamentais.

## O problema de boilerplate que RTK resolve

```js
// ❌ classic Redux — verbose: action types, creators, switch reducers, manual immutability
const INCREMENT = "counter/increment";
const increment = () => ({ type: INCREMENT });
function reducer(state = { value: 0 }, action) {
  switch (action.type) {
    case INCREMENT: return { ...state, value: state.value + 1 };
    default: return state;
  }
}
```

## RTK: createSlice faz tudo

```js
import { createSlice, configureStore } from "@reduxjs/toolkit";

export const { increment, incrementBy } = counterSlice.actions; // action creators AUTO-generated
const store = configureStore({ reducer: { counter: counterSlice.reducer } });
```

`createSlice` gera automaticamente tipos de ação e criadores, e — via **Immer** — permite que você escreva código reducer "mutante" que é convertido com segurança para atualizações imutáveis. Um slice conciso substitui todas as partes manuais.

## O que mais RTK inclui

```text
configureStore   → store setup with DevTools + thunk middleware preconfigured
createAsyncThunk → standard async (pending/fulfilled/rejected actions) for data fetching
createEntityAdapter → normalized state + CRUD reducers for collections
RTK Query        → a full data-fetching/caching layer (like React Query, built into Redux)
```

## Exemplo de createAsyncThunk

```js
export const fetchUsers = createAsyncThunk("users/fetch", () => api.getUsers());
// auto-dispatches users/fetch/pending | fulfilled | rejected — handle in extraReducers
```

## Por que RTK é o padrão agora

```text
✓ ~75% less code than classic Redux
✓ Immer → no manual immutable spread logic (fewer bugs)
✓ Good defaults (DevTools, thunk) out of the box
✓ Encourages best practices (slices, normalized data)
✓ RTK Query bundles server-state management
```

## Por que isso importa

A maior crítica do Redux clássico era seu boilerplate; RTK corrige isso diretamente, razão pela qual é agora a **recomendação oficial** e o que "usar Redux" significa em codebases modernos.

Compreender `createSlice` (alimentado por Immer, ações geradas automaticamente), `createAsyncThunk` (async), `createEntityAdapter` (normalização) e RTK Query (estado do servidor) é essencial para o trabalho contemporâneo com Redux — preserva a previsibilidade do Redux enquanto remove a cerimônia que levou muitos times a alternativas.

O problema de boilerplate que RTK resolve

RTK: createSlice faz tudo

O que mais RTK inclui

Exemplo de createAsyncThunk

Por que RTK é o padrão agora

Por que isso importa

Perguntas relacionadas