"Enter"a basıp içeriğe geçin

React Native AsyncStorage Kullanımı

Tüm platformlarda basit şekilde veri saklama ve okuma işlemleri için key-value şeklinde veri saklayan bazı yazılımlar kullanırız. React native tarafında da key-value şeklinde veri yazma ve okuma işlemleri için AsyncStorage denilen bir yapı kullanıyoruz.

React Native AsyncStorage Kullanımı

React Native AsyncStorage Kullanımı

Daha gelişmiş veri saklama yöntemi olarak cihazda bir üst seçenek olarak Sqlite’ı değerlendirebilirsiniz yada cloud bir çözüm için de Firebase’e bakabilirsiniz ama makalemizin konusu olarak AyncStorage’de nasıl key-value veri saklayabileceğimizi göreceğiz. AsyncStorage basit olarak string türde veri saklamaktadır o yüzden obje tutmanız gereken durumlardan JSON.stringify kullanılarak objeyi serialize edip string olarak saklayabilirsiniz. Özetleyecek olursak AsynStorage veriyi şifresiz, asenkron, kalıcı, key-value şeklinde saklayan bir yapıdır. LocalStorage yerine kullanmalısınız daha güvenlidir.

iOS’da küçük değerler serialize edilmiş olarak sözlükte(dictionary) ama daha büyük değerler ise ayrı dosyalar olarak saklanmaktadır. Anroid’de ise AsyncStorage için native tarafta RocksDB yada SQLite’dan hangisi mevcut ise otomatik olarak değerler bu 2 seçenekten birinde saklanıp yönetilmektedir.

AsynStorage Javascript API’si oldukça basit, temiz ve anlaşılırdır metod isimlerinden bile herhangi bir yardımcı kaynağa yada dökümantasyona ihtiyaç duymadan kolayca kullanabilirsiniz.

Örnek olarak alttaki gibi AsynStorage’i import edebilirsiniz.

Kullanımdan Kaldırıldı(DEPRECATED): AsyncStorage react-native paketinden import edilerek kullanılabilir ama yakın zamanda kaldırılacak. O yüzden https://github.com/react-native-community/async-storage paketini yükleyin ki ilerleyen zamanlarda projenizde herhangi bir sıkıntı yaşamayın.

Eğer https://github.com/react-native-community/async-storage kaynağından paketi kurup sonrasında problem yaşamak istemiyorsanız alttaki komut ile paket kurulumunu gerçekleştirebilirsiniz.

yarn add @react-native-community/async-storage

Alttaki şekilde import ederek paketi kullanabilirsiniz.

Bundan sonraki örnekler @react-native-community/async-storage paketi üzerinden verilecektir. AsyncStorage metodlarının tamamı Promise olarak çalışmaktadır o yüzden await keyword’ünü kullanabilir yada await kullanamadığınız durumda then-catch gibi Promise callback fonksiyonlarını da rahatlıkla kullanabilirsiniz.

setItem

Sözdizimi

Altta göreceğiniz gibi tek satırda veri saklama işlemi yapabiliyorsunuz. Fakat dikkat etmeniz gereken bir durum var key ve value değerleri string olmak zorundadır. Key’in string olmasını anlatıkta value’ya obje set etmem gerekecek ne yapıcam o zaman diyeceksiniz. Bunun içinde JSON.stringify fonksiyonunu kullanarak objelerinizi serialize edebilirsiniz.

getItem

Sözdizimi

Bu fonksiyonda bir üstteki setItem’ın tam tersi işlem olarak daha önce yazmış olduğunu değeri okuma işlemi yapmaktadır. Geri dönen veri tabii ki string olacaktır veri saklama sırasında obje olan bir veriyi saklamak için nasıl JSON.stringify kullandıysak string olarak dönen değeri objeye dönüştürmek için JSON.parse fonksiyonunu kullanabiliriz.

removeItem

Sözdizimi

Birinci parametresinde göreceğiniz gibi sizden istemiş olduğu key değeri ile eşleşen bir kayıt olması durumunda ilgili kaydın silinmesini sağlar.

mergeItem

Sözdizimi

clear

AsyncStorage’in itemlarının temizlemesini sağlar.

Sözdizimi

getAllKeys

Sözdizimi

Tüm AsyncStorage keylerini almayı sağlıyor.

flushGetRequests

Sözdizimi

multiGet

Sözdizimi

Birden fazla vereceğiniz key listesine göre keylere karşılık gelen değerleri getirir.

multiSet

Sözdizimi

Birden fazla set işleminin yapılmasını sağlıyor.

multiRemove

Sözdizimi

Birden fazla vereceğiniz key listesine ait kayıtların silinmesini sağlar.

multiMerge

Sözdizimi


📚 Diğer React Native Makaleleri


📚 Kaynaklar

  • https://facebook.github.io/react-native/docs/asyncstorage
  • https://github.com/react-native-community/async-storage

✏️ Lütfen olumlu-olumsuz tüm görüşlerinizi bana yorum yada mail yolu ile iletmeyi ihmal etmeyin.

🔗 Sosyal medya kanallarından makaleyi paylaşarak destek olursanız çok sevinirim.

👋 Bir sonraki makalede görüşmek dileğiyle.

İlk Yorumu Siz Yapın

    Bir cevap yazın

    E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir