MM Coder-react native storage(beginner)

Knowledge React

143

react native storage(beginner)

Myo Thant Kyaw

မင်္ဂလာပါ

စာလေးတွေလည်းမရေးတာကြာပီ။

Expo-Secure-Storage , Async-Storage အကြောင်း လေးကို

နည်းနည်းဆွေးနွေးပေးပါမယ်ဗျ။

React Native နဲ့ Expo တို့ကို အသုံးပြုပြီး mobile app တွေ ဖန်တီးတဲ့အခါ ဒေတာသိမ်းဆည်းခြင်း (data storage) က အရေးပါပါတယ်။

ဘယ်ဟာကို ဘယ်လိုရွေးချယ်အသုံးပြုသင့်တယ်ဆိုတာကပိုမိုအရေးပါပါတယ်။

📜 Async-Storage ဆိုတာဘာလဲ?

→ Async-Storage က React Native အတွက် ရိုးရှင်းတဲ့ key-value သိမ်းဆည်းမှုစနစ်တစ်ခုဖြစ်ပါတယ်ဗျ။

→ သိမ်းဆည်းထားတဲ့ အချက်အလက်တွေကို encrypted မလုပ်ထားပါဘူး

→ ဒါကြောင့် sensitive information တွေမသိမ်းရပါဘူး

ဥပမာ - token,secret key , access code လိုအချက်အလက်တွေကိုမသိမ်းရပါဘူး

📜 ဘယ်နေရာတွေမှာသုံးသင့်လည်း ?

→ mobile app ရဲ့ dark,light mode swith တဲ့အခါမျိုးတွေ

→ offline caching လုပ်ချင်တာမျိုးတွေ

→ sensitive မဖြစ်တဲ့ အချက်အလက်တွေကိုသိမ်းရမှာဖြစ်ပါတယ်။

📜 Async-Storage ကို ဘယ်လိုသုံးမလဲ?

→ npm install @react-native-async-storage/async-storage

import AsyncStorage from '@react-native-async-storage/async-storage';

// ဒေတာသိမ်းရန်
const saveData = async () => {
  await AsyncStorage.setItem('user', 'mtk');
};

const readData = async () => {
  const user = await AsyncStorage.getItem('user');
  console.log(user); // mtk ကိုရရှိမှာဖြစ်ပါတယ်။
};

📜 Expo-Secure-Storage ဆိုတာဘာလဲ?

→ expo ကဖန်တီးထားတဲ့ storage တစ်ခုဖြစ်ပါတယ်။

→ os level မှာ enctypted လုပ်ပီးသိမ်းထားပါတယ်။

→ iOS မှာ Keychain၊ Android မှာ Encrypted SharedPreferences တို့ကို အသုံးပြုပါတယ်။

→ programming အသုံးပြုပီး access လုပ်ခွင့်မရှိပါ။

→ data store,get လုပ်တဲ့အခါမျိုးတွေမှာ fingerpring, device auth ကိုအသုံးပြုပီးသိမ်းဆည်းထားနိုင်ပါသေးတယ်။

ဒါကြောင့် secure ဖြစ်နေမှာဖြစ်ပါတယ်။

📜 ဘယ်နေရာတွေမှာသုံးသင့်လည်း ?

→ auth secret key များသိမ်းဆည်းခြင်း

→ in app pin များသိမ်းဆည်းထားခြင်း

→ security token များသိမ်းဆည်းထားခြင်း

စသဖြင့် အရေးကြီးချက်အလက်များကိုသိမ်းဆည်းရာတွင်

အသုံးပြုသင့်ပါတယ်။

📜 xpo-Secure-Storage ကို ဘယ်လိုသုံးမလဲ?

→ npx expo install expo-secure-store

import * as SecureStore from 'expo-secure-store';

// ဒေတာသိမ်းရန်
const saveToken = async () => {
  await SecureStore.setItemAsync('authToken', '12345abc');
};

// data ပြန်ယူရန်
const readToken = async () => {
  const token = await SecureStore.getItemAsync('authToken');
  console.log(token); // Output: 12345abc
};

ဒါဆိုရင် နားလည်သွားလောက်မယ်ထင်ပါတယ်ခင်ဗျ။

--------

→ mmcoder မှာ react native with expo course ကိုဖန်တီးနေပါတယ်။

react native ,expo , react navigation ,styled components

တွေကိုအဓိကထားသင်ကြားပေးထားပီး project တွေရေးပြတဲ့အထိသင်ကြားပေးထားပါတယ်။

→ course ကို preregister လုပ်လိုပါက message မှာစာရင်းပေးထားနိုင်ပါတယ်

fees ကြိုသွင်းစရာမလိုပါ။

→preregister user များက discount များစွာနဲ့ ဝယ်ယူလေ့လာနိုင်မှာဖြစ်ပါတယ်။

--------

Comment:

Please Login To Create Comment Login

Software House 2 weeks ago thanks bro

Paing Phyo Zaw 2 months ago Good

Languages

Laravel PHP NodeJS NPM Vue Javascript React

Ajax Mysql

react native storage(beginner)

Comment:

Categories

Languages