“Anlatım, ReactJS üzerinden yapılacaktır.“
Redux kullandığımız uygulamalarda, sayfa değiştiğinde, yenilendiğinde veya uygulama kapatıp tekrar açıldığında, redux’ taki değişkenlerin tekrar eski haline dönmesi veya sıfırlanması sebebiyle tekrar kullanmak istediğimizde ulaşamayız. Bu yüzden sayfa yenilendiğinde tekrar istek atar ve değişkenleri tekrar setleriz. Özellikle genelde servisten gelen sabit objeler veya arraylerde bu can sıkıcı hale gelir çünkü tekrar servise istek atıp değişkeni tekrar setlemek gerekir.
Redux persist, redux’taki değişkenlerin, sayfa yenilendiğinde, değiştiğinde veya uygulama kapatıp tekrar açıldığında tekrar eski haline dönmesini veya sıfırlanmasını engellemeye yarayan, bu değişkenleri localstorage da saklayan bir pakettir.
Bir örnekle anlatmak gerekirse; Login sayfamızı reducera yazdığımız loginState adında boolean bir değişkene bağladığımızı düşünelim.
Bu değişken true olduğunda login sayfası, eğer false ise dashboard sayfası gözükecektir.
Redux persist kullanmadığımızda sayfa her yenilendiğinde reducer sıfırlanacak, loginState eski haline dönecek yani true olacak ve login sayfası tekrar gözükecektir. Daha önceden login olduğumuz halde tekrar login ekranı önümüze gelecektir.
Ancak redux persist kullanıldığında böyle bir durum yaşanmayacak loginState i true ya setlemediğimiz sürece login sayfası gözükmeyecektir.
1. Kurmamız gereken paketler;
npm i redux npm i react-redux npm i redux-persist npm i reselect
2. Kuracağımız redux, index.js ve App.js dosyalama yapısı su şekilde olacak;
3. Öncelikle actiondaki set fonkisyonu için constant bir değer tanımlayalım.
4. Sonrasında action.js dosyasında set fonksiyonumuzu tanımlayalım.
5. Reducer dosyasını oluşturalım ve değişkenimizi tanımlayalım.
6. Selector.js’ ten loginState için bir select fonksiyonu yazalım.
7. index.js dosyamızı oluşturalım. Eğer bir servise istek atılacak ve saga kullanılacaksa aşağıdaki kod satırlarında commentlenen satırları comment out yaparak kullanabilirsiniz. Eğer sürekli kayıt edilmesini istediğimiz bir değişken varsa bunu whitelist in içine, kayıt edilmesini istemediğimiz bir değişken varsa blacklist in içine ekleyebiliriz. Eğer hiç bir ekleme yapmazsak reducerda olan bütün değişkenler localstorage a kayıt edilir.
Yukarıdaki anlatılan kod örneklerinin tamamını görmek ve denemek için github reposunu ziyaret edebilirsiniz.
Özetlemek gerekirse redux-persist paketi, bir değişkeni tekrar tekrar istek atıp set işlemi yapmak yerine tek bir istekte setleyip siz değiştirmediğiniz sürece aynı kalması sebebiyle kullanışlı bir pakettir.
Diğer blog yazılarımıza göz atmak için burayı tıklayabilirsiniz.
Software Developer
SAP SIGNAVIO PROCESS MANAGER NEDİR?
Signavio Process Manager, sezgisel, bulut tabanlı, profesyonel süreç modellemesi sunan bir SAP Signavio modülüdür. SAP Signavio Process...
Kur Farkı Nedir? SAP Kur Farkı Faturası Çözümü
Yerli para biriminin yabancı para birimine göre fiyatına “kur” denir. İki para biriminin birbiriyle değiştirilmesi sırasında ortaya...
MDP SAP Gelen e-Fatura Çözümü
Şirketlerin e-Dönüşüm yolculuğunda, en önemli adımlarından birisi fatura işlemleri sürecidir. Kanunen zorunlu hale getirilen e-Arşiv...
Üretim Süreçlerinizi İyileştiren 5 Yalın Teknik
Yalın üretim, işletmelerin iş süreçlerinde israfa neden olan faktörleri tespit ederek ortadan kaldırmasını, verimliliği ve kaliteyi...
Açık Bankacılık (Open Banking) Nedir?
Açık bankacılık, bankacılığın önemli dönüşüm kollarından birisidir. Modern çağda sektöre kesin giriş yapmayı ve kullanıcılara...
ERP Sistemi Seçerken Dikkat Edilmesi Gerekenler
Dijital teknolojiler tarihteki herhangi bir yenilikten daha hızlı ilerlemiştir ve tarih boyunca teknolojik devrimler işgücünü...
ERP (Kurumsal Kaynak Planlama) Nedir?
ERP TanımıERP (Enterprise Resource Planning/ Kurumsal Kaynak Planlama) kuruluşların günlük iş faaliyetlerini yönetmeye yarayan bir yazılım...
SAP PI/PO Danışmanı Nasıl Olunur?
SAP danışmanlığı kariyeri, günümüzde öğrenciler ve yeni mezunlar için en popüler kariyer seçenekleri arasında yer almaktadır. SAP...
ABAP Nedir? SAP ABAP Danışmanlığı Nedir?
ABAP, yazılım şirketi SAP tarafından geliştirilen dördüncü nesil, üst düzey bir programlama dilidir. ABAP kelimesi başlangıçta "genel...
Mailiniz başarıyla gönderilmiştir en kısa sürede sizinle iletişime geçilecektir.
Mesajınız ulaştırılamadı! Lütfen daha sonra tekrar deneyin.