Redux Toolkit (RTK) inatoa nini zaidi kuliko Redux ya kawaida?

Question

Accepted Answer

**Redux Toolkit (RTK)** ni njia rasmi inayopendekezwa ya kuandika Redux leo. Inaondoa tatizo linalojulikana sana la Redux — aina za hatua za mikono, waundaji wa hatua, mantiki ya sasisho la kutofautiana, ujumbe wa duka — lakini inahifadhi misingi sawa.

## Tatizo la koodi inayorudiwa ambalo RTK linasuluhisha

```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 linafanya kila kitu

```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` hutengeneza aina za hatua na waundaji wa hatua kiotomatiki, na — kupitia **Immer** — inakuruhusu kuandika "inabadilisha" koodi ya kupunguza ambayo inabadilishwa kwa usalama kuwa sasisho la kutofautiana. Sehemu moja iliyofupishwa inabadilisha sehemu zote za mikono.

## Nini kingine RTK kinajumuisha

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

## Mfano wa createAsyncThunk

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

## Kwa nini RTK ni kiwango sasa

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

## Kwa nini inakusudiwa

Ukaguzi mkubwa zaidi wa Redux ya kawaida ulikuwa koodi yake inayorudiwa; RTK inasuluhisha hiyo moja kwa moja, ndio maana sasa ni **tafsiri rasmi** na nini maana "kutumia Redux" katika misingi ya koodi ya kisasa.

Kuelewa `createSlice` (inaendeshwa na Immer, hatua zilizotengeza kiotomatiki), `createAsyncThunk` (kiotomatiki), `createEntityAdapter` (ukawaida) na RTK Query (hali ya seva) ni muhimu kwa kazi ya Redux ya kisasa — inahifadhi utabiri wa Redux wakati inaondoa sherehe ambayo ilisukuma timu nyingi kwa mbadala.