React Hooks: useState, useEffect ve Custom Hooks | YZ Canlı Yazılım

YZ Satır Satır Ders

0 / 87

100% eğitim kalitesi

Canlı Önizleme index.html | 0 satır

Satır Açıklaması

Öğrenme rotası

Dersi nasıl çalışmalısın?

Önce componentin aldığı props ve tuttuğu state’i bulun. Sonra state değişince hangi render’ın tekrarlandığını ve effect’in hangi koşulda çalıştığını izleyin.

Props ile state arasındaki farkı ve component renderına etkisini açıklamak.
useEffect dependency array’inin effect çalışma zamanını nasıl belirlediğini yorumlamak.
Tekrarlanan state/effect mantığını custom hooka ayırabilmek.

HTML

Ne İşe Yarar?

—

Ne İşlem Yapar?

—

Sonuç

—

Bu panel nasıl çalışır?

Oynat düğmesine bastığınızda her adımın amacı, çalışma mantığı, sonucu, yaygın hatası ve sizin yapacağınız küçük deneme burada görünür.

Kalıcı beceri kontrol listesi

Hata ayıklama: Önce state ve props değerlerini loglayın. Sonra dependency array’i, effect’in çalışma zamanını ve componentin gereksiz render olup olmadığını tek tek kontrol edin.

Test: State’i değiştiren normal, boş ve hızlı tekrarlanan etkileşimleri deneyin; ekrandaki değerin ve effect yan etkisinin beklediğiniz sırada değiştiğini doğrulayın.

Güvenlik: Kullanıcı verisini render ederken güvenli biçimde işleyin; HTML’i doğrudan enjekte etmeyin ve API anahtarlarını client componentine gömmeyin.

Sürdürülebilirlik: Componentleri küçük sorumluluklara ayırın; tekrar eden state/effect mantığını anlamlı isimli custom hooklara taşıyın.

Kod yazıldıkça console.log/info/warn/error çıktıları burada görünecek.

Kod Satırı

0 / 87

Hazır

Dersi nasıl çalışmalısın?

ElevenLabs sunucu sesi seç — Ses Kredisi