configureStore

Store'u kurup Provider ile sarmayı öğrenirsin.

configureStore

configureStore, RTK'nin store kurucu fonksiyonudur. Klasik Redux'deki combineReducers + applyMiddleware + compose zincirini tek bir çağrıya indirir.

reducer alanına slice'larını nesne olarak verirsin: { cart: cartReducer, product: productReducer }. RTK otomatik olarak combineReducers uygular.

RTK store'u redux-thunk ile gelir; bu sayede async işlemler için ek middleware gerekmez. DevTools da otomatik etkindir.

Provider ile sarma

Store'u uygulamaya bağlamak için Provider bileşeni kullanılır. <Provider store={store}><App /></Provider> biçiminde tüm uygulamayı sararsın.

Böylece tüm alt bileşenler useSelector ve useDispatch ile store'a erişebilir. Provider, React context tabanlı çalışır.

Store tek seferlik oluşturulur; her çizimde yeniden üretilmez. Bu yüzden main.jsx içinde modül seviyesinde tanımlanır.

Uygulama Store kur ve Provider sar

Aşağıdaki iskeleti tamamla. configureStore ile store oluştur; reducer olarak { cart: cartReducer } kullan. cartReducer'ı './cartSlice''tan içe aktar. export default store ekle.

Örnek çözümü göster

import { configureStore } from '@reduxjs/toolkit';
import cartReducer from './cartSlice';

const store = configureStore({
  reducer: {
    cart: cartReducer,
  },
});

export default store;

Kendini test et

configureStore neyi otomatik ekler?
```
Thunk is ready for async work.
```
- CSS reset
- Tailwind CSS
- redux-thunk middleware
- React Router
Cevabı göster

redux-thunk middleware — configureStore redux-thunk'ı otomatik ekler.

Provider kullanımı

<____ store={store}><App /></Provider>

Cevabı göster

<Provider store={store}><App /></Provider>

configureStore: kavramları eşleştir

configureStore

Store kurar
Provider

Uygulamayı sarar
useSelector

State okur
useDispatch

Action gönderir

Sıradaki ders: Özet - Redux Toolkit

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler