Storing Data in Electron JS Applications - 4 Methods

Every app requires storing some sort of data. Earlier I made a video about using Sqlite with Electron, in this video I am going to show you 4 other ways of storing data in Electron.
These methods are suitable for smaller pieces of data that can be stored in key value pairs.
The methods are
Flat JSON file,
sessionStorage
localStorage
IndexedDb
You can store data in IndexedDb on both the renderer and the main process.
Watch this video to see these storage methods in detail.
Code : github.com/cyr...
Don't forget to Subscribe and hit the bell icon so that you'll get notified about my videos.
#electronjs #programming #coding

[@talhazaryab]

I wish your channel grow fast. Your content is rare.

[@ramdomguyfiftychars]

Thank you very much! This helps a ton! Working on a hobby project to play around with Electron+Vite+Vue here :D

[@coderjeet]

Great combo! :)

[@jeremiahthompson82]

Thanks. Great job

[@blazebd97]

Just what I needed

[@coderjeet]

Glad it helped

[@dipankarsahoo7119]

this really helped me a lot thanks sir

[@coderjeet]

Glad it helped

[@tripmad]

Thank u for all your tutorials😊

[@andreicusnir8077]

Hey I have a question. Would it work with Electron version 23.1.3 and Angular 15? I have tried to save the data with Electron-store from ngx-electron but it failed. I also used IPC to store the data and again, fail. Are there other alternatives? Would be very happy to get an answer. Thanks

[@senikouame4750]

if I use js Fill how can I, make CRUD system with it ??

[@adamjones1951]

How do we write multiple data points to the file instead of overwriting the pre-existing data?

[@jisonsoft4810]

Can you create a plugin architecture in electrons?

[@allencorbalan5879]

super informative and helpful thanks!

[@coderjeet]

You are welcome!

[@giriai]

But how did you write file on MAS? MAS doesn't allow you to write data to disk...

[@coderjeet]

Hmm.. Mas?

[@afnibi]

auto subs...thanks from indonesia

[@OmniaAb]

very helpful, thank you

[@vanbachucnguyen1831]

thanks for your instruction

[@arijitchakrabarty1552]

Quite insightful! Thanks! Quick question: I have a routine manager application. In it, I want to give the user the ability to store routines. Should I use IndexedDB for that or would storing it in a local json file be better? Thanks!

[@coderjeet]

I wouldn't use both. If you have data that needs to be saved, don't save it in browser sessions. Save it in a json file

[@arijitchakrabarty1552]

@@coderjeet understood. Thanks!

[@Dungeon-Umami]

I did it like this:
preload.js:
const {contextBridge, ipcRenderer} = require('electron');
contextBridge.exposeInMainWorld('storage', {
w_storage: (data)=>ipcRenderer.invoke('storage', data)
});
main_node.js:
const fs = require("fs");
ipcMain.handle('storage', (e, result)=>{
if(result.method === 'read'){
if (fs.existsSync(result.path)) return JSON.parse(fs.readFileSync(result.path));
}
if(result.method === 'write'){
fs.writeFileSync(result.path, JSON.stringify(result.data, null, 2));
return "data saved";
}
});
window.js:
async function herota123(){
let Need_to_save = {lol: "kek", che: ["bu","rek"]};
let await_writing = await globalThis.storage.w_storage({method: "write", path: "delete_me.json", data: Need_to_save});
console.log("await_writing", await_writing);
let Read_from_memory = await globalThis.storage.w_storage({method: "read", path: "delete_me.json", data: undefined});
console.log("Read_from_memory", Read_from_memory);
}
herota123();

[@andreicusnir8077]

erjan

[@ABentPaperclip]

you never actually showed how the json data gets out of an object in main.js back to render- you're just logging it to the console, which isn't enough to re-populate your form...