Terkadang saat kita membuat sebuah aplikasi mobile, kita kadang diharuskan menyimpan data di lama penyimpanan local/ local storage, yah ada berbagai alternatife untuk menyimpan data secara local pada aplikasi mobile React Native, kita bisa menggunakan room, sqlite. Namun yang paling populer di React Native adalah AsyncStorage. AsyncStorage dapat menyimpan data dalam penyimpanan internal dan bisa digunakan dengan baik di platform iOS maupun Android.
 |
| AsyncStorage React Native |
Pertanyaan selanjutnya apakah kamu butuh mempelajari AsyncStorage jika ingin menjadi seorang React Native developer? jawabannya iya, kenapa jika kamu sudah berinteraksi dengan authentication dari backend kamu harus menyimpan token atai JWT Token, dan menyimpanannya di penyimpanan lokal. Dan cara yang paling mudah, efisien dan dianjurkan di React Native adalah dengan menggunakan AsyncStorage. Pada awalnya AsyncStorage adalah komponen primitif di React Native, namun sekarang kita harus menggunakan AsyncStorage dari komunitas library.
Apa Yang Akan Kita Pelajari
1. Pengenalan AsyncStorage
2. Menyimpan (Set Item AsyncStorage ) dan Menghapus (Remove) AsyncStorage React Native
Apa Itu AsyncStorage?
AsyncStorage adalah React Native's API untuk menyimpan data secara terus-menerus melalui perangkat. Ini adalah sistem penyimpanan yang dapat digunakan pengembang dan menyimpan data dalam bentuk pasangan nilai kunci. Jika Anda berasal dari latar belakang pengembang web, itu sangat mirip dengan API browser Penyimpanan lokal.
Kesimpulan simpel nya : Ketika use mengclose aplikasi atau mematikan smartphone mereka data mereka akan tersimpan dan tidak hilang.
Memulai Project
1. Pertama buat sebuah project baru React Native di terminal atau cmd mu
npx react-native init example
2. Setelah itu install library AsyncStorage pastikan kamu di root project
npm i @react-native-community/async-storage
3. Agar bisa berjalan di iOS silahkan ketikan perintah di bawah ini
cd ios/ && pod install4. Setelah itu buka file App.js di root project anda dan ubah file tersebut menjadi seperti kode di bawah ini :
Setelah itu jika kamu telah menuliskan kode di atas, silahkan jalankan kode yang telah kamu buat, oh ya untuk penjelasannya sudah saya kasih di komentar kode saya. Jalankan perintah npx react-native run-android atau ios dan jika berhasil maka tampilannya akan seperti dibawah ini
 |
| AsyncStorage React Native |
 |
| AsyncStorage React Native |
Baca Tutorial Lainnya
#1 Pengenelan React Native Dan Cara Instalasinya Lengkap
#2 Tutorial React Native State Dan Props Serta Penjelasannya
#3 Tutorial Menampilkan Gambar React Native Yang Baik & Benar
#4 Tutorial React Native Alert, Beserta Jenis-Jenisnya Lengkap
#5 Tutorial ClickListener Pada React Native Serta Penggunaannya
#6 Tutorial React Native: Text Italic, Bold, Underline dan Styling
#7 Tutorial Membuat Custom TextArea Pada React Native
#8 Tutorial React Native Mengubah Warna Pada Placeholder
#9 Tutorial React Native : Advanced Webview Dengan Loader
#10 Tutorial Open Link Url Website Di React Native#9 Tutorial React Native : Advanced Webview Dengan Loader
#11 Tutorial React Native WhatsApp Direct Send Link
#12 Tutorial React Native Modal Dengan Desain Gambar
#13 Tutorial React Native : React Navigation 5 Untuk Navigasi
#14 Tutorial React Native : Mengirim Data Pada React Navigation
#15 Tutorial React Native Top TabView Gesture Lengkap
#16 Tutorial React Native : Animation JSON Lottie
#17 Tutorial Dan Penjelasan Lifecycle Pada Classes React Native
#18 Tutorial Get API React Native Yang Baik Dengan Axios
#19 Tutorial Get Detail Data React Native Axios Github API
#20 Tutorial Date Time React Native Membuat Aplikasi Stopwatch
#21 Tutorial React Native State Management Redux Lengkap
#22 Tutorial React Native : Redux Thunk Get API
#23 Tutorial In-App Browser Modern Dengan React Native
0 Comments