A High Level View of Electron
Electron is a essentially a wrapper that encapsulates previously existing technologies; According to the documentation, Electron is…
Node.js has allowed front-end engineers to more easily transition to writing server-side code and includes APIs for accessing file systems, creating servers, and loading external modules.
A bit of history…
In 2013, Electron was birthed as ‘Atom Shell,’ the foundation for a hackable text-editor called Atom that currently offers multi-platform support. What sets Atom truly apart from its predecessors and competitors is not necessarily what it can do, but how it was built — without all the headache typically required to boost cross-platform functionality.
Electron became open-sourced in 2014 and maintains its popularity among a full range of software developers and organizations seeking a quicker product launch and production time. One argument against using this library may be its magnitude. Electron boots a pretty fat size for relatively simply apps, but considerable benefits outweigh its costs.
Normally, if you wanted to build a desktop app for 3 different operating systems, you would need to learn at least three new languages or frameworks. The beauty of building desktop apps in Electron is that you can use all the skills you already possess and know so well.
Electron enables a developer to create an entirely new breed of app than we have seen previously, offering a new class of application development in which you get some pretty awesome features out of the box: automatic updates, native menus & notifications, app crash reporting, debugging & profiling, windows installers — all making for a much more seamless production environment and development experience.
Electron helps us create Graphic User Interfaces (GUIs) for Node apps with Native OS capabilities. Essentially, everything you can do in the browser and in Node, you can do in Electron. As you may have predicted, these apps live in the user’s system tray or menu bar and have the ability to run offline.
If you’re not motivated to use Electron yet, building an Electron application allows you to do things that would not normally be possible in a browser. For example, two huge benefits of using Electron are:
- Accessing the filesystem
- Activating native OS dialogs
These actions are best handled by the main process, one of 2 essential Electron processes that run simultaneously and don’t share memory or state:
- Main Process
- Renderer Processes
Your package.json’s entry point will specify primarily how the Main Process communicates with native OS APIs and responds to lifecycle events, while the Renderer Processes cannot communicate with Native OS APIs. They use the main process as a middle man and are responsible for loading web pages to display the main GUI. They may sum to zero or larger, depending on how many you specify or how many your app needs.
The main process and our renderer process are completely separate. In order to facilitate communication between the two, there is a necessary intermediary: Electron’s interprocess communication (IPC) protocol to communicate between processes. More about IPC can be understood by taking a glance at the documentation on electron remotes.
If you’re interested in running through a guided-build of an Electron app, see what the FireSale is all about — taught by Steve Kinney, the Director of the Front-End Engineering program at Turing: School of Software & Design. This tutorial was made for building a Markdown-to-HTML renderer.
Feel like taking the plunge:
npm install -g electron