Persist Middleware ile Durumu Kalıcı Hâle Getirme
persist middleware'ini kullanarak Zustand durumunu localStorage veya sessionStorage ile eşitleyin.
Persist Middleware ile Durumu Kalıcı Hâle Getirme, CoddyKit'te ücretsiz bir React Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, React Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. React Academy kursu toplamda 4 dersten oluşur.
Hoş Geldiniz
Durumu Neden Kalıcı Hâle Getirmeli?
persist Ara Yazılımı
import { create } from 'zustand';
import { persist } from 'zustand/middleware';
const useCartStore = create(
persist(
(set) => ({
items: [],
addItem: (item) => set(s => ({ items: [...s.items, item] })),
}),
{ name: 'cart-storage' } // localStorage key
)
);partialize ile Kısmi Kalıcılık
persist(
(set) => ({ user: null, token: null, loading: false, fetch: () => {} }),
{
name: 'auth-storage',
partialize: (state) => ({ user: state.user, token: state.token }),
// loading and fetch are NOT persisted
}
)sessionStorage Kullanma
import { createJSONStorage } from 'zustand/middleware';
persist(storeCreator, {
name: 'session-data',
storage: createJSONStorage(() => sessionStorage),
})Sürümleme ve Geçiş
persist(storeCreator, {
name: 'my-store',
version: 2,
migrate: (persistedState, version) => {
if (version === 1) {
return { ...persistedState, newField: 'default' };
}
return persistedState;
},
})Hidrasyon ve SSR
onRehydrateStorage Geri Çağırması
persist(storeCreator, {
name: 'auth',
onRehydrateStorage: () => (state) => {
if (state?.token) state.fetchUser();
},
})Kalıcı Durumu Temizleme
const handleLogout = () => {
useAuthStore.persist.clearStorage();
useAuthStore.setState({ user: null, token: null });
};Depolama Boyutu Sınırları
Hızlı Kontrol
Özet
Sırada
Yapay zeka eğitmeniyle React öğren — ücretsiz
Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.
- Kurslar
- 88
- Dersler
- 324
Sıkça Sorulan Sorular
“Persist Middleware ile Durumu Kalıcı Hâle Getirme” dersi ücretsiz mi?
Evet — “Persist Middleware ile Durumu Kalıcı Hâle Getirme” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve React Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. React Academy kursu toplamda 4 dersten oluşur.
“Persist Middleware ile Durumu Kalıcı Hâle Getirme” dersinde ne öğreneceğim?
persist middleware'ini kullanarak Zustand durumunu localStorage veya sessionStorage ile eşitleyin. React Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
React Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te React Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.
“Persist Middleware ile Durumu Kalıcı Hâle Getirme” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu React Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her React Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- İlk Zustand Store'unuzu Oluşturma
- Seçiciler ve Gereksiz Yeniden Oluşturmaları Önleme
- Persist Middleware ile Durumu Kalıcı Hâle Getirme
- Zustand DevTools ve Store'ları Test Etme