How to save large data in local using reactJs?

Question

Now I use ReactJs and I want to save large data in local, I try to look for a SQLite for reactJs but I can't find it, all about SQLite for react-native, Please give me information how to save large data in local using reactJs.

Thanks.

Check this - https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage — ravibagul91, Sep 03 '19 at 16:29
@ravibagul91 Is localStorage available for large data ? isn't localStorage has a limit ? — Frank Andrew, Sep 03 '19 at 17:10

score 0 · Answer 1 · answered Sep 03 '19 at 19:03

You're saying locally but in one of your comments you are concerned about the amount of data that can be saved..

If you're not looking for the overhead of a full-scale database solution, you could use Firebase RealTime Database; It's free for up to 1 gb of data and super easy to set up.

https://firebase.google.com/products/realtime-database/

You'll define a schema for your database through Firebase's console then copy and paste the config into your code then run an intitalization script and then use firebase refs to access the API (see below for simple example)

npm install firebase


import firebase from 'firebase';
var config = {
  ... {paste-from-firebase}
};


 writeUserData(name, priority){
    firebase.database().ref('users').push({
        name,
        priority
    }).then((data)=>{
        //success callback
        console.log('data' , data)
    }).catch((error)=>{
        //error callback
        console.log('error ' , error)
    })
  }

componentDidMount(){
    // initialize firebase
    if (!firebase.apps.length) {
      firebase.initializeApp(config);
    }
    // an example of writing user data to the db
    this.writeUserData('John', 'normal')
  }

If you want to implement SQLite in your application, you will need to implement it server-side and not client-side for several reasons; the most important being security... Take a look at this SO answer:

Is it possible to access an SQLite database from JavaScript?

Apparently, there's also another relatively newer option called IndexedDB that some browsers support to locally store large amounts of structured data;

https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB

I would use firebase. It's well-supported, made by Google, and very easy to get set up with.

How to save large data in local using reactJs?

1 Answers1