React Hooks ile Modern Komponent Geliştirme
React Hooks, fonksiyonel komponentlerde state ve lifecycle özelliklerini kullanmamızı sağlayan güçlü araçlardır.
useState Hook
En temel hook olan useState ile state yönetimi:
const [count, setCount] = useState(0);
useEffect Hook
Yan etkileri yönetmek için useEffect:
useEffect(() => {
document.title = `${count} kez tıklandı`;
}, [count]);
Custom Hooks
Kendi hook’larınızı oluşturabilirsiniz:
function useLocalStorage(key, initialValue) {
const [value, setValue] = useState(() => {
return localStorage.getItem(key) || initialValue;
});
useEffect(() => {
localStorage.setItem(key, value);
}, [key, value]);
return [value, setValue];
}
React Hooks sayesinde kod daha okunabilir ve yeniden kullanılabilir hale geliyor!