Mit nyújt a Redux Toolkit (RTK) a klasszikus Redux-hoz képest?

Question

Accepted Answer

**Redux Toolkit (RTK)** a Redux írásának hivatalos, javasolt módja ma. Kiküszöböli a klasszikus Redux szenviáltig ismert boilerplate-jét — manuális action típusok, action creatorok, immutable update logika, store beállítás — miközben megőrzi ugyanazokat az alapelveket.

## Az RTK által megoldott boilerplate probléma

```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 mindent megtesz

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

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

A `createSlice` automatikusan előállítja az action típusokat és creatorokat, és — az **Immer** segítségével — lehetővé teszi, hogy "mutáló" reducer kódot írj, amely biztonságosan konvertálódik immutable frissítésekre. Egyetlen tömör slice helyettesíti az összes manuális részt.

## Mit tartalmaz még az RTK

```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)
```

## createAsyncThunk példa

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

## Miért az RTK a standard most

```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
```

## Miért fontos ez

A klasszikus Redux legnagyobb kritikája a boilerplate-je volt; az RTK közvetlenül megoldja ezt a problémát, ami miatt most az **hivatalos javaslat** és azt jelenti "Redux-ot használni" a modern codebase-ekben.

A `createSlice` (Immer-nal működtetett, automatikusan generált actions), `createAsyncThunk` (async), `createEntityAdapter` (normalizálás) és RTK Query (szerver állapota) megértése elengedhetetlen a kortárs Redux munkához — megőrzi a Redux előrejelezbiliteljét, miközben eltávolítja azt a szertartást, amely sok csapatot alternatívák felé kényszerített.