REACT HOOK SERIES
React Hooks — useReducer Nedir?
Hook konusunda seriye devam ediyoruz. Bu yazıda React içerisinde gelen useReducer Hook üzerinde duracağız.
Bu konuya başlamadan önce serinin ilk iki yazısı olan React Hooks Nedir ? ve React Hooks Neden Çıktı ? yazılarını okumanızı öneririm..
React Hook bileşenler için ortak bir takım davranışların kanca atılarak sağlanması olduğunu anlatmıştım. Aynı aşağıdaki resimde olduğu gibi.
Bir önceki yazımızda useState, useEffect, useContext Hook’larından bahsetmiştik. Bu yazıda useReducer Hook anlatacağız.
useReducer , geliştiricilere bileşenlerin state bir akış şeklinde yönetiliyorsa bu aşamada bir kolaylık sağlar useState yerine bu Hook’tan faydalanabilirsiniz. Örneğin aşağıdaki örnekte Ekranımızda bir counter değeri var. Buna etki eden UI Bileşenleri var. En basit yöntem bunu useState üzerinden kullanarak 1 arttırmak, 1 azaltmak veya 0 set etmek olarak düşünülebilir.
Fakat useReducer bu ve daha kompleks State geçişleri için geliştiricileri bunu aynen Redux mekanizmasındaki benzer şekilde dispatch mantığı ile yönetmenize imkan sağlar.
- Aşağıda kırmızı gördüğümüz kısım reducer fonksiyonu ve mevcut state ve bu state bir sonraki aşamaya geçirecek komutu bekliyor.
- 2nci kısımda useReducer dispatch ve state(count) bilgisini alıyoruz
- dispatch fonksiyonu gönderdiğimiz “string” komutunu ilgili reducer (state, action) olarak iletilmesinden sorumlu…
- Sonrasında bileşenimiz tekrardan render edilecektir.
Redux nedir şeklinde aklınızda bir takım sorular var ise React-Redux serisi içerisinde yazmış olduğum yazılarıları okumanızı öneririm.
Bazen bana şu şekilde sorular geliyor. Redux, React Hook useReducer ve useContext ile birlikte artık sonu geldi mi? Bizim Redux kullanmamıza gerek var mı ? Bu konuyu neden hep soruyorlar ?
Çünkü Redux ilk kurulum aşaması karmaşık ve öğrenmesi zor.
Özetle Context → Store gibi Global değişkenlerimizi tutarız. useReducer vereceğiniz reducer fonksiyonu ve dispatch fonksiyonu üzerinden bunu çağırarak Flux örüntüsünü sağlamış oluyorsunuz. Bu doğru bir söylem.
Buradaki Yanlış söylem, Redux’ın yaptıklarını ve sağladıklarını useReducer ve Context sağlayabiliriz dersek, Her programlama dili ile her uygulamayı geliştiririz demek gibi oluyor. Bu konuyu, bu 2 yaklaşım arasındaki farkları detaylı şekilde bir sonraki yazımda anlatacağım.
State Management konusunda benim ilgimi çeken 2 kütüphaneden de bahsedeyim.
En son XState için bir katalog sitesi oluşturmuşlar. Oldukça ilginç akışlar bulunuyor. Fırsat bulunca detaylı bir şekilde incelemeyi düşünüyorum.
Source Kod
Okumaya Devam Et 😃
Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.
