useEffect ne işe yarar?

useEffect ne işe yarar?

useEffect fonksiyonu, iki parametre alır: birincisi bir işlev, ikincisi ise bir dizi (opsiyonel) değerdir. İşlev parametresi, useEffect'in çalıştırılmasını istediğimiz herhangi bir kod bloğunu içerebilir. Bu fonksiyon, genellikle bir API çağrısı, bir veritabanı işlemi veya bir başka bileşeni güncellemek gibi yan etkileri içerir.

İkinci parametre olan dizi, useEffect'in belirli bir değişkenin değişimini takip etmesini sağlar. Eğer bu dizi belirtilmezse, useEffect her bileşen güncellendiğinde çalışacaktır. Eğer dizi boş ise, useEffect sadece bileşen oluşturulduğunda çalışır. Eğer diziye bir değişken verilirse, useEffect sadece o değişken güncellendiğinde çalışır.

useEffect'in en yaygın kullanımı, API çağrıları veya veritabanı işlemleri gerçekleştirmektir. Bu işlemler tipik olarak bir komponentin oluşturulduğunda yapılması gereken şeylerdir. useEffect fonksiyonu bu işlemleri genellikle bir yan etki olarak ele alır ve bileşenin güncellenmesi veya kaldırılması gerektiğinde düzgün bir şekilde temizlenmesini sağlar. Bu sayede hafıza sızıntıları veya diğer problemler önlenmiş olur.

Örneğin, bir kullanıcının giriş yaptığı bir uygulamada, useEffect fonksiyonu, kullanıcının kimlik bilgilerini doğrulamak için bir API çağrısı yapabilir. useEffect yan etkisini temizlemek için ise bileşenin kaldırılmasında API çağrısını iptal eder. Bu, uygulamanın güvenli ve düzgün çalışmasını sağlamak için önemlidir.

useEffect aynı zamanda bileşenlerin mount ve unmount işlemleri sırasında kullanılabilir. Örneğin, bir bileşen oluşturulduğunda bir abonelik başlatmak isteyebiliriz. useEffect bu aboneliği kuracak ve bileşen silindiğinde abonelikten çıkacaktır. Bu tür senaryolarda useEffect, bileşenin tamamen başarılı bir şekilde işlev görmesi ve hafıza kaynaklarının doğru bir şekilde yönetilmesi için kullanışlıdır.

Özetlemek gerekirse, useEffect, React bileşenlerinin hayat döngüsüne etki etmemizi sağlayan bir fonksiyondur. Yan etkilerin yönetimi, API çağrıları, veritabanı işlemleri veya aboneliklerin başlatılması ve sonlandırılması gibi işlemlere uygulanır. Bu fonksiyon sayesinde bileşenlerin davranışı kontrol edilebilir ve olası hafıza sızıntıları veya diğer problemler önlenmiş olur.

Sıkça Sorulan Sorular

useEffect, React'ta bir bileşenin render edildikten sonra çalıştırılmasını sağlayan bir kancadır. Bileşenin yaşam döngüsünün belirli bir noktasında, genellikle bileşenin yüklendikten sonra veya güncelleme sonrasında yan etkileri (side effects) yürütmek için kullanılır.

useEffect, API istekleri, veritabanı sorguları, veri manipülasyonu, aboneliklerin yönetimi gibi yan etkileri yürütebilmek için kullanılır. Aynı zamanda bir bileşenin yüklendikten sonra veya güncelleme sonrasında belirli bir kod parçasını çalıştırması gerektiğinde de kullanılır.

useEffect, useState gibi bir React kancasıdır ve işlevsel bileşenler içerisinde kullanılır. Bu kancaya verilen bir işlev, bileşen yüklendikten sonra veya güncellendikten sonra çalıştırılır. useEffect üzerindeki bir bağımlılık dizisi, belirli bir duruma veya prop değişikliğine bağlı olarak bu işlevin yeniden çalışmasını tetikler.

useEffect'in ikinci argümanı, bağımlılık dizisidir. Bu dizi, useEffect'in hangi değişkenlerde bir güncelleme veya değişiklik olduğunu izlemesini sağlar. Bu değişkenlerden biri veya daha fazlası değiştiğinde, useEffect işlevi yeniden çalışır. Bu dizi, boş bırakılırsa useEffect her güncelleme sonrasında çalışır.

Öncelikle useEffect kancasını kullanabilmek için React'ı ve useState'yi içe aktarmamız gereklidir. Sonrasında işlevsel bileşen içerisinde useEffect'i kullanabiliriz. Örneğin: