Offline webapp - Storing JavaScript objects

Question

I'd like to make a simple web browser console program that would run COMPLETELY OFFLINE.

In that program, I'd like to store some data in the form of an array of objects so that I could easily pick a random object.

My problem is that even though I looked up the internet, including this question Storing Objects in HTML5 localStorage and this question Offline webapp. How to store data? , I still don't have any clue of what to do.

I'd like to find a way to easily add objects to my array and save those changes so that when I open the browser again, the data set would be intact.

I understand that HTML5's local storage only stores data in the form of strings, so what should I do ?

Should I use Node.js ? If so, how can I send back the data to my web browser Javascript file so that I can display things in the browser ?

http://thejackalofjavascript.com/getting-started-with-node-webkit-apps/ — Chris L, Oct 11 '15 at 17:25
If you are going to write an offline appliation. Indexdb will be the best storage option (in my opinion) — ecarrizo, Oct 11 '15 at 19:29

score 2 · Answer 1 · answered Oct 11 '15 at 17:24

You can serialize your array of objects using JSON.stringify so that it is stored as a string in Web Storage and deserialize it upon retrieval using JSON.parse:

var arrayOfObjects = [
    { foo: 'hello' },
    { bar: 'world' },
    { baz: 'dinosaurs' }
];

function storeInWebStorage(key, arr) {
    localStorage.setItem(key, JSON.stringify(arr));
}

function retrieveFromWebStorage(key) {
    return JSON.parse(localStorage.getItem(key));
}

storeInWebStorage(arrayOfObjects);

Keep in mind though that there's a limit on the amount of data you can store in Web Storage, and this limit differs between browsers.

Thanks, I actually didn't know that JSON.stringify was working with an array as an input :) — Experience111, Oct 16 '15 at 08:49

Offline webapp - Storing JavaScript objects

1 Answers1