Build desktop apps using Electron

Working with web technology about he part years, you surely heard about Nodejs (who wouldn’t?).

So where Nodejs is about reusing the same JavaScript skills on the server-side, Electron is about reusing those skills for desktop apps.

I have been working for a while with Electron.

Let’s look again at what’s Nodejs:

  • based on chromium for JavaScript execution engine
  • Added feature to interact with filesystem access, ports (e.g. http server)
  • No UI (it is an execution engine to just run code!)

So what about Electron?

Well, basically you can think of Electron being Nodejs + UI, UI being here proper windows and not just HTML/CSS rendering.

What makes Electron interesting in that regard is that:

  • Electron runs as Nodejs for all server-side frameworks you want to use: web-sockets, queuing….
  • Electron provides a way to spawn “windows”, which can embed their own execution logic
  • Electron has one main process (aka the “server-side”) and a thread for each opened window
  • More interestingly, those processes can communicate together (using buit-in IPC capabilities)

Here is a drawn example of channel creation & subscription to close windows from the main process:

The bests things about Electron are:

  1. All this is that Electron offers a way to bundle your app to run independently on MAcOS, Windows & Linux!
  2. You can keep all your JavaScript development habits on frameworks you use with Nodejs, and the same applies to front-end, as you can embed Angular, React an build SPAs just like you were doing for an existing site; you can actually port an exiting website as an Electron app without that much efforts!
  3. As the UI you build is based on Chromium as the rendering engine, you don’t have to make any compat choices because of old or previous browsers not supporting Xor Y, you always get the top notch features available in Chrome engine!

Go and try it out here, happy coding!

 

Leave a Reply

Your email address will not be published. Required fields are marked *