React Native Installing Realm Mobile Database in Android or IOS

When Realm was launched in 2014, the goal was to help mobile developers build better apps faster by giving them a robust alternative to SQLite and Core Data. The Realm Mobile Database is a cross-platform database solution that can be used as an alternative to SQLite and Core Data. Compared to these two options, Realm is easier to set up and use. To perform the same operation in Realm, you usually end up writing fewer lines of code than you would with SQLite or Core Data. On performance, Realm is said to be faster and it also offers other modern features such as encryption, JSON support and data change notifications.

What is Realm ?

Realm is not an ORM, and is not built on top of SQLite. Instead we’ve built a full database for mobile app developers, one that uses native JavaScript objects that are dynamically mapped to a full, custom database engine (not just a key-value store). This allows us to provide a simple API while preserving performance. With Realm, you can model complex data, link objects in a graph, and compose advanced queries.

Advantages of Realm over SQLite:

1. easy to use
2. faster than SQLite (up to 10x speed up over raw SQLite for normal operations)
3. object conversion handled for you
4. very responsive team
5. Cross-platform support.
6. convenient for creating and storing data on the fly.

Installing Realm Mobile Database In React Native

Step-1 : Create a new react native project, if you don’t know how to create a new project in react native just follow this tutorial.

Step-2 : Install the realm package in your React Native project, using below command :

npm install --save realm

Screenshots after successful installation.

Step-3 : Next, step we need to execute link command in order to refresh the complete React Native project and index the Realm mobile database. This command helps to Link all native dependencies.

npm install --save realm

Screenshot after executing link command:

Realm Mobile database is successfully installed and ready to use in your react native project. 

Step-4: Open App.js  in your favourite code editor and erase all code and follow this tutorial.

Step-5: Through react , react-native  packages import all required components that required for react native application development. 

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Button } from 'react-native';
var Realm = require('realm');

Step-6: Open App.js file, Then Create constructor in your App class and call the super method inside constructor. Also inside the constructor you need to create the realm mobile database table schema, which is required for storing data in real database. 

constructor() {

    super();   

    realm = new Realm({
      schema: [{
        name: 'Employee',
        primaryKey: 'emp_id',
        properties:
        {
          emp_id: { type: 'int', default: 0 },
          emp_first_name: 'string',
          emp_last_name: 'string'
        }
      }],
      schemaVersion: 0
    });
  }

Step-7: Implement render method and place below layout design inside the render block. 

• Create Realm inbuilt write mode function that helps to insert data into Object table and with the help of realm create function we are storing object fields in database.

// Writing data to real database
    realm.write(() => {
      var ID = realm.objects('Employee').length + 1;
      realm.create('Employee', { emp_id: ID, emp_first_name: 'rajesh', emp_last_name: 'kumar' });
    });

• Read the stored data in realm database with the help of realm object.

// getting realm database data using employee object
    var employeeClass = realm.objects('Employee');
    var getJSONData = JSON.stringify(employeeClass);
    realm.close();

Lets see the complete code block implementation of render function block.

 render() {

    // Writing data to real database
    realm.write(() => {
      var ID = realm.objects('Employee').length + 1;
      realm.create('Employee', { emp_id: ID, emp_first_name: 'rajesh', emp_last_name: 'kumar' });
    });

    // getting realm database data using employee object
    var employeeClass = realm.objects('Employee');
    var getJSONData = JSON.stringify(employeeClass);
    realm.close();


    return (
      <View style={styles.container}>
        <Text style={{ fontSize: 15, textAlign: 'center' }}>
          {getJSONData}</Text>
      </View>
    );
  }

Step-8 : Apply the below style sheet design.

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
  },
});

Complete Source Code for App.js 

Lets see the complete source code that helps to create and insert data into realm database in react native application.

App.js

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, Button } from 'react-native';
var Realm = require('realm');

let realm;

export default class App extends Component {

  constructor() {

    super();   

    realm = new Realm({
      schema: [{
        name: 'Employee',
        primaryKey: 'emp_id',
        properties:
        {
          emp_id: { type: 'int', default: 0 },
          emp_first_name: 'string',
          emp_last_name: 'string'
        }
      }],
      schemaVersion: 0
    });
  }

  render() {

    // Writing data to real database
    realm.write(() => {
      var ID = realm.objects('Employee').length + 1;
      realm.create('Employee', { emp_id: ID, emp_first_name: 'rajesh', emp_last_name: 'kumar' });
    });

    // getting realm database data using employee object
    var employeeClass = realm.objects('Employee');
    var getJSONData = JSON.stringify(employeeClass);
    realm.close();


    return (
      <View style={styles.container}>
        <Text style={{ fontSize: 15, textAlign: 'center' }}>
          {getJSONData}</Text>
      </View>
    );
  }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
  },
});

Screenshot :

This is all about React Native Installing Realm Mobile Database in Android or IOS Tutorial. Thank you for reading this article, and if you have any problem, have a another better useful solution about this article, please write message in the comment section.