نصب دیتابیس Realm در React Native

دیتابیس Realm برای React Native در Feb 2016 ارائه شد و در March 2, 2018 به نسخه 2.2.0 upgrade شد.Realm از object persistence و قابلیت های query بصورت کامل پشتیبانی میکنه و بسیاری سریعتر از SQLite برای اپلیکیشن های React Native برای هر دو پلتفرم Android و Ios است.دیتابیس Realm بر روی تمامی دیوایس ها به طور مستقیم و درون موبایل قابل اجرا است.
Realm چیست و چگونه کار میکند:
Realm یک سیستم نگاشت object relational نیست و بر اساس ساختار SQLite ساخته نشده،Realm از object های native جاوا اسکریپت برای نگاشت اتوماتیک به syntax دیتابیس موبایل و Object relational modal استفاده میکنه.ما میتونیم از Realmخیلی راحت با نصب یک کتابخانه در پروژه استفاده کنیم.Realm خیلی راحت قابل فهمیدن است و بسیار سریعتر از SQLite و دیتابیس های موبایل Cross Platform است.شما میتونید اطلاعات بیشتر رو از وب سایت رسمی Realm کسب کنید.
1.دایرکتوری پروژه React Native خودتون رو در Command Prompt / Terminal باز کنید و دستور زیر رو اجرا کنید(البته توجه کنید که ما از سمت Realm تحریم هستیم و باید از VPN قبل از اجرای دستور استفاده کنید):
1 |
npm install --save realm |
2.بعد از نصب موفقیت آمیز کتابخانه باید در Command Prompt / Terminal باید محیطی شبیه اسکیرین شات زیر رو داشته باشید.
3.حالا باید دستور link رو برای refresh شدن کامل پروژه React Native و ایندکس شدن دیتابیس Realm اجرا کنید.
1 |
react-native link realm |
دیتابیس موبایل Realm با موفقیت نصب شده و ما میتونیم در پروژه React Native خودمون ازش استفاده کنیم و مرحله بعدی یعنی کد نویسی رو شروع کنیم.
4.ایمپورت کردن کامپوننت های StyleSheet, View, Image, Text و Platform در پروژه.
1 2 3 |
import React, { Component } from 'react'; import { StyleSheet, View, Image, Text, Platform } from 'react-native'; |
5.ایمپورت کردن ماژول Realm در پروژه.
1 |
var Realm = require('realm'); |
6. ایجاد یک متغیر global به نام realm. از این متغیر برای بازکردن و بستن دیتابیس استفاده میکنیم.
1 |
let realm ; |
7.تعریف constructor و اجرا کردن دستور Schema برای ایجاد object Table در Realm.
name : نام Object Table.
roperties :نام هر فیلد با نوع داده ای
اگر شما قصد دارید اطلاعات بیشتری در مورد نوع های داده ای در Realm کسب کنید میتونید داکیومنت مربوطه رو از اینجا بخونید.
1 2 3 4 5 6 7 8 9 10 11 12 13 |
super(); realm = new Realm({ schema: [{name: 'User_Demo', properties: { id: {type: 'int', default: }, first_name: 'string', last_name: 'string' }}] }); } |
8.استفاده از حالت write داخلی برای واردکردن اطلاعات در Object table در بلاک render’s
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
render() { realm.write(() => { var ID = realm.objects('User_Demo').length + 1; realm.create('User_Demo', {id: ID, first_name: 'Pooja', last_name: 'Sharma'}); }); return ( ); } |
9.حالا تمامی اطلاعات آبجکت User_Demo رو درون متغیر A ذخیره میکنیم.ما باید از متد JSON stringify برای بازکردن همه آیتم های درون A استفاده کنیم.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
render() { realm.write(() => { var ID = realm.objects('User_Demo').length + 1; realm.create('User_Demo', {id: ID, first_name: 'Pooja', last_name: 'Sharma'}); }); var A = realm.objects('User_Demo'); var myJSON = JSON.stringify(A); realm.close(); return ( ); } |
10.اضافه کردن کامپوننت View درون بلاک render’s return و نمایش تمامی Object ها با استفاده از کامپوننت Text.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
render() { realm.write(() => { var ID = realm.objects('User_Demo').length + 1; realm.create('User_Demo', {id: ID, first_name: 'Pooja', last_name: 'Sharma'}); }); var A = realm.objects('User_Demo'); var myJSON = JSON.stringify(A); realm.close(); return ( <View style={styles.MainContainer}> <Text style={{fontSize: 15, textAlign: 'center'}}>{myJSON}</Text> </View> ); } |
11.ایجاد استایل سفارشی
1 2 3 4 5 6 7 8 9 10 11 12 13 |
const styles = StyleSheet.create({ MainContainer :{ flex:1, alignItems: 'center', justifyContent: 'center', paddingTop: (Platform.OS) === 'ios' ? 20 : , margin: 10 } }); |
کد کامل برنامه در فایل App.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 |
import React, { Component } from 'react'; import { StyleSheet, View, Image, Text, Platform } from 'react-native'; var Realm = require('realm'); let realm ; export default class App extends Component{ constructor(){ super(); realm = new Realm({ schema: [{name: 'User_Demo', properties: { id: {type: 'int', default: }, first_name: 'string', last_name: 'string' }}] }); } render() { realm.write(() => { var ID = realm.objects('User_Demo').length + 1; realm.create('User_Demo', {id: ID, first_name: 'Pooja', last_name: 'Sharma'}); }); var A = realm.objects('User_Demo'); var myJSON = JSON.stringify(A); realm.close(); return ( <View style={styles.MainContainer}> <Text style={{fontSize: 15, textAlign: 'center'}}>{myJSON}</Text> </View> ); } } const styles = StyleSheet.create({ MainContainer :{ flex:1, alignItems: 'center', justifyContent: 'center', paddingTop: (Platform.OS) === 'ios' ? 20 : , margin: 10 } }); |
اسکرین شات:
مطالب زیر را حتما مطالعه کنید
چگونه از ماژول های نیتیو Android و IOS در React Native استفاده کنیم؟
آموزش آرایه در جاوا اسکریپت ( JavaScript)
استفاده از Flipper در پروژه های ری اکت نیتیو (React Native)
نمایش PDF در react native
ایجاد Timeline ListView در React Native
آموزش React Navigation 5
8 دیدگاه
به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.
سلام
دوست عزیز همچنان مشکل من حل نشد
شما جدیدا پرژه ای با realm ایجاد کردید؟ آیا مشکل از ورژن react نیست؟
واینکه من اپلیکیشنی را باید آماده کنم که توی انو باید دیتابیسی ایجاد بشه که ممکنه تا 100000 تا رکورد داشته باشه شما چه دیتابیسی را پیشنهاد میکنید و آیا توی دوره های آموزشی دیتابیسی را آموزش دادید؟
با تشکر
سلام.من جدیدا پروژه ای رو ایجاد نکردم.
دیتابیس local اگر میخواید که realm بهترین گزینس.ولی اصولا کسی این حجم دیتا رو روی دیتابیس local نگه داری نمی کنه و سمت سرور این اطلاعات ذخیره میشه
سلام
من روی یه سیستم دیگه یه پروژه جدید ایجاد کردم و realm رو نصب کردم
وقتی برنامه رو اجرا میکنم. برنامه کرش میشه و بسته میشه
لطفا راهنمایی کنید
با تشکر
سلام علیرضا عزیز.
از دستور adb logcat در پوشه SDK/platform-tools را اجرا کنید
سلام
من وقتی realm رو نصب کردم دیگه پروژه اجرا نشد و این خطا رو داد
Failed to capture fingerprint of output files for task ‘:app:processDebugResources’ property ‘sourceOutputDir’ during up-to-date check.
> Could not read path ‘G:\ReactPoject\realmtest\android\app\build\generated\not_namespaced_r_class_sources\debug\processDebugResources\r\android\arch\lifecycle\viewmodel’.
فکر میکنید علت خطا چیه
سلام علیرضا عزیز.
حدس میزنم این فایل در ابزار دیگه ای که استفاده می کنید، باز است.برای حل این مشکل در دایرکتوری پروژه دستورات زیر را اجرا کنید:
cd android && gradlew clean
cd .. && react-native run-android
سلام.
چرا ایمپورت کردن realm، با بقیه ی ایمپورت ها فرق داره؟ نمیتونه این شکلی باشه؟ ‘import realm from ‘realm
سلام.تست نکردم.ولی فکر نکنم مشکلی داشته باشه.این سبک ایمپورت مربوط به ES5 میشه