React Native App using Realm Database

** Create a Database Schema

**
*Folder ./Db/Schema.js
*

export const TodosSchema = {
    name:'Todos',
    properties:{
        _id:'string',
        title:'string',
        completed:'bool'
    },
    primaryKey:'_id'
}

App.js

import React, {useEffect, useState} from 'react';
import {Button,ScrollView,StyleSheet,Text,View} from 'react-native';

import Realm from 'realm';
import {TodosSchema} from './db/schema';
import {nanoid} from '@reduxjs/toolkit';

Declareations States

let realm;

const App = () => {
const [data, setData] = useState([]);

create realm instance on app launch

 useEffect(() => {
    const getRealmInstance = async () => {
      try {
        realm = await Realm.open({
          path: 'myrealm',
          schema: [TodosSchema],
        });
      } catch (e) {
        console.log(e);
      }
    };
      let todos = realm.objects('Todos');
      setData([...todos]);
    getRealmInstance();
  }, []);

//CREATE DATA In Object

  const createData = () => {
    realm.write(() => {
      realm.create('Todos', {
        _id: nanoid(),
        title: 'this is ui',
        completed: true,
      });

    });   

** Single Read**

let  item =realm.objectForPrimaryKey('Todos','id');
console.log(item)

**UPDATE DATA

**

const UpdateData = id => {
    realm.write(() => {
      let data = realm.objectForPrimaryKey('Todos', id);
      // data.title = 'SDM';
      data.completed = true
      // console.log(data._id)
      console.log(data);
      // realm.delete(data)

    });

  };

DELETE Function

const (DeleteTodo)= id => {
    realm.write(() => {
      let deletedata = realm.objectForPrimaryKey('Todos', id);
      realm.delete(deletedata);
    });

  };`

return (
<View>
<TextInput style={styles.input}  placeholder="title " />
<Button onPress={createData} title="Add Tasks..." />

<ScrollView>
{data.map(item => (
<View key={nanoid()}>
   <Text>{item.title} , {String(item.completed)}</Text>
   <Text>{item._id}</Text>
<View>
   <Button onPress={UpdateData(item._id)} title="Edit" />
   <Button onPress={DeleteTodo(item._id)} title="Delete" />
</View>
</View>
))}
</ScrollView>
 </View>
  );
};

export default App;

const styles = StyleSheet.create({
input: {
height: 40,
margin: 12,
borderWidth: 1,
padding: 10,
},
});

Package.josn

**Dependencies**

`"dependencies": {
    "@reduxjs/toolkit": "^1.7.1",
    "react": "17.0.2",
    "react-native": "0.66.4",
    "react-redux": "^7.2.6",
    "realm": "^10.11.0",
    "redux": "^4.1.2"
  },
`

`