DEV Community

Cover image for Have you built any projects with Electron?
Madza
Madza

Posted on

Have you built any projects with Electron?

Thanks to Electron you can build cross-platform desktop apps with JavaScript, HTML, and CSS. It's an open-source project, that uses Chromium and Node.js and is actively maintained by GitHub.

It's been in my eye for a while, so I'm curious have you built any projects with it, and what was your experience?

Discussion (31)

Collapse
dansilcox profile image
Dan Silcox

Yeah, I love electron! I built a memory game (where you have to remember numbers - inspired by youtube.com/watch?v=zsXP8qeFF6A) - this was actually better suited to a browser-based/online game in the end.

I also made an internal (non-internet) network monitoring tool for a friend whose company does security in places with private (non-internet) local networks for the CCTV cameras - that uses node and ICMP ping to check uptime of various devices and uses Electron's inter-process-communication (IPC) for the communication between front-end and back-end within the app. This was also the first one I actually exported as a Windows and a Mac binary so it helped me learn how to use the user's local storage area on whatever device etc (for a small settings SQLite DB and some JSON config basically in my case).

Another fun one was a soundboard I made for my church's "nativity" play last year - our church rent a school and don't have a usable internet connection there, so it needed to be offline - so I made a really simple app with basically an "admin" screen where you "upload" audio files and give them a name/description and then a "user" screen where you just have a load of buttons to actually play the various sounds. I started writing an article about it and then got distracted (a year ago :P) - maybe I'll get back on that at some point :)

Collapse
eduardfaus profile image
Eduard Faus

That’s very interesting I guess Electron is very powerful for offline apps.

Collapse
dansilcox profile image
Dan Silcox

Yes for sure - VSCode and before it Atom were both built on Electron, same with GitHub desktop, Slack, many others you wouldn't expect

Thread Thread
eduardfaus profile image
Eduard Faus

I already knew that GitHub desktop, atom, and vs code where made with it but it never crossed my mind that it had real potential for offline apps. Thanks you :D.

Collapse
paulasantamaria profile image
Paula Santamaría • Edited on

I did! Actually, @maurogarcia_19 and I built a few apps with Electron. One was a tool to sync files from a remote server into your PC automatically, here's a link with a few screenshots. We're really happy with how it turned out.

We had to overcome some issues though. It wasn't easy to configure SQLite (I don't quite remember why, but I remember it was a real headache). We also found it challenging to generate the package and manage app updates.

This was a few years ago, so maybe these things have become a bit easier now.

I'm curious about Electron.NET. I haven't tried it yet, but it may be interesting for people with a .NET background.

Collapse
dansilcox profile image
Dan Silcox

Yes SQLite was a nightmare for me too - because Electron bundles your app files inside an "ASAR" archive, so you have to (a) take it out the ASAR (there's some option for that, can't remember off-hand) and (b) put it in the "user files" path rather than the actual app root (so it's writable).

Collapse
patarapolw profile image
Pacharapol Withayasakpunt

SQLite is still the best database for Electron.

However, for some time, only node-sqlite3 can be compile (with electron-gyp to *.node) in macOS. better-sqlite3 cannot be used.

Collapse
gautham495 profile image
Gautham Vijayan

Yeah I built a markdown editor in electron.

It was fairly easy because if you know HTML, CSS and JavaScript you can easily create one.

The tough part is to build it and push it to Microsoft and apple store.

You have to do a lot of work on that.

But in future it is going to be the go to one as companies are opting for cross platform development for lowering their cost and development time.

Lets see!!

Collapse
vladned profile image
Vlad Nedelcu

Just saw this post and got interested in Electron because I wanted to do the same with one app that I have build with C#.

One question, can you install the apps locally without pushing it to any store ?

Collapse
gautham495 profile image
Gautham Vijayan

Yeah mate you can do it. You have to do it with electron-builder or electron-packager.
I did with electron-builder and I am using it locally.

Do you want me to do a post on that?

Thread Thread
vladned profile image
Vlad Nedelcu

It will help a lot :D Some posts over Stack Overflow are not that explicit.

Thread Thread
gautham495 profile image
Gautham Vijayan

I think I am gonna do it! Stay tuned!

Thread Thread
gautham495 profile image
Gautham Vijayan

Vlad I made an article because you asked!
Here is the link Electron-Builder

Thread Thread
gautham495 profile image
Gautham Vijayan

Tell me your views about it!!

Collapse
jcolag profile image
John Colagioia (he/him)

Yes. It has fallen horribly out of date and always had a package problem (registering as an error, which made creating an installer difficult), but while I was at a job that decided to use Slack for everything, but didn't pay for the accounts, I was able to put together SlackBackup shockingly quickly.

For simpler tools, I've been using Proton Native, which translates React Native to Qt interfaces, but it's not ready for prime time (it still doesn't have window titles) and hasn't seen an update in quite a few months, so I can't quite recommend it, yet.

Collapse
vivekalhat profile image
Vivek Alhat

I am currently working on electron based desktop music player. So far I am enjoying working on it. It is extremely powerful. The only problem I have faced is in integrating the node backend with the electron.

Collapse
zoedreams profile image
☮️✝️☪️🕉☸️✡️☯️ • Edited on

yep, i have worked with electron for about 4 years now. I also have a lot of work into making multiple window apps with IPC routing. you would think multi windows would be easy but its actual quite hard. each window has its own sandbox so you need to use some fancy event arch to communitcate.. If you take a peak into the sources of torchie you will find a more advanced event manager system, view manager, and p2p Rest routing.. also has templates on how to handle configuration options and hot live reloading of your app.

github.com/ZoeDreams/electron-reac...
github.com/ZoeDreams/torchie-shell

HMU if you have any question in electron, I am happy to answer or help trouble shoot.. Electron is super fun, but the learning curve is extremely steep to do anything of complex nature, but once you learn the API and ecosystem its super fun and easy to make amazing applications like discord.

i would also strongly recommend implementing an in memory db to manage your data and settings etc.. this is a port of mongo which i have used extensively in torchie. its lightening fast and can index up to 100k records no problem in memory.. This is super important because you do NOT want to use local storage as its kinda slow when you start pumping in lots of data.

github.com/techfort/LokiJS

also has persisten storage which can run on your main process and renderers.. using my event engine in torchie you can share and communicate between multiple database volumes.. super slick! happycoding

Collapse
louislow profile image
Louis Low

A few...

Collapse
ozgrozer profile image
Ozgur • Edited on

I've made a lot of small applications back in the time and except the file size I think Electron is the best tool to build cross platform apps if you're a web developer.

Taking screenshots of web pages.
github.com/ozgrozer/truman

Scraping web pages.
github.com/ozgrozer/travis

A unit converter.
github.com/ozgrozer/trevor

An image resizer.
github.com/ozgrozer/electron-image...

Collapse
szhabolcs profile image
Nagy Szabolcs

I've participated in a 24hr app making contest to get some extra points for the main event. We made a working app that helped teachers monitor kids that seem not to be active during class. You could argue it had some GDPR holes in it lol, but the main idea was that you would use it along side a meeting app like zoom, and you could see what the kids in the class had open and could also close their applications, as well as block certain websites so they couldn't use them. We should have implemented like a "are you sure you want to close this app" feature, and also a nudge feature but we didn't really had time for it. It was basically a negative reinforcement app but hey, the judges gave us the most points because they said this approach actually works.

Anyways it was really fun making it, since it was out first time (me and my colleague's) making something using electron and Socket.IO. 😄

Ps. Ama share a link to the GitHub repo if anyone is interested 😁

Collapse
tvinko profile image
Tomaž Vinko

i created visual designer with Electron. It’s great for creating multiplatform applications very easily. However, it has cons, like large bundle size and performance. For my project I created UI part in Electron and part where I need performance, in C++ and C#. You can see it in action here algonia.net/Home/Documentation/pro...

Collapse
arturssmirnovs profile image
Arturs Smirnovs

It's been in my eye's as well, so i gave it a shot and built this project: parluks.com/

To be honest i think i didn't had any issues with it, easy to code, easy to understand documentation, easy to build files for linux, mac, windows..

It's worth a try if you want to build app with desktop experience.. :)

Collapse
framerate profile image
Justin BLACK LIVES STILL MATTER

doomtrooper.com

Collapse
szhabolcs profile image
Nagy Szabolcs

No waay you made an actual steam game using electron 😯

Collapse
framerate profile image
Justin BLACK LIVES STILL MATTER

Sky is the limit, my friend <3 (technically I've made 3)

Collapse
jeremiergz profile image
Jeremie Rodriguez • Edited on

Good timing, I just finished refactoring an app using Electron! 😊
Honestly, it's a great tool, powerful, but not without its pain points.
The apps are kinda bloated but loads fast so I guess it's not a major problem.
And I think it's also a little difficult to understand how to communicate in the most secure way between your Electron process and the renderer but once you got to grips with it it's fine!
You can check my app out, it's nothing much, just a humble file hashing utility: HashR.

Collapse
patarapolw profile image
Pacharapol Withayasakpunt

Yes, but not really successful, nor production level.

It was a project I want to have full and latest web browser API's, not just minimal JavaScript engine as in Qt WebEngine.

Collapse
kailyons profile image
Loralighte

I have built apps with it, but with that came my distain for the library. For me it's slow and running QT apps is both easier and faster.

Collapse
asixjin profile image
King Asix

I usually use Electron when I need to build a tool for game development. I've create at least three tools with it.

Collapse
roicp profile image
Rodrigo Ipaves de Campos Pinto

I use Electron to interact with some peripherals through serial ports and USB, things like scales and thermal printers

Collapse
caiofior profile image
Claudio Fior

I did some years ago. I built a program that extracts data in excel from a web site loaded inside an iframe with a nightmare authentication process.