Extending Your App Beyond the Web with Electron

At Viget, we have a constant stream of projects that provide us with new challenges and interesting opportunities. We have a wide array of tools to help us accomplish any client's needs, but sometimes a client has a problem that we have never solved before. Instead of forcing the client to change their needs to meet our skillset, this inspires us to find the right tool for the job. Recently, we had the opportunity with an application that seemed like a typical browser-based project, but had a few key elements that stuck out as a candidate to build on Electron.

Hold up, What is Electron?

Electron is an application wrapper for JavaScript projects. With Electron you can create a typical web-based project that uses HTML, CSS and JavaScript and package it to be installed as an application on a computer. This means that instead of visiting the application from within a browser with an internet connection, users can download it, install it and open it whenever they want. This makes available for the users if they are on an airplane, on the bus, or any place without a consistent connection and allows them to save any data on their computer and sync up later when a connection is available.

Once installed on a computer, the application is afforded more control over the operating system than a standard website. This means the application can read and write files on the computer, work easily in offline mode, and allow for custom shortcuts.

Back to the Problem at Hand

For this particular project, our client wished to create an application that recorded meeting audio and uploaded the audio files to a third party service. However, there was a catch. Our client knew that the user may not have a decent internet signal, or a signal at all, when they recorded their meetings. After much deliberation, we decided Electron was the perfect fit for this challenge.

Electron would allow the user to work completely offline to record the meetings, store the audio files on the user's computer in an encrypted database, and then upload the audio files once the user had a suitable internet connection. We built the frontend of the application in React to allow for maximum flexibility and wrapped it up in Electron to be distributed on MacOS and Windows. Since launching last month, we have had dozens of successful audio files submitted through this application.

The Future of Electron at Viget

This was our first project using Electron at Viget, but it was a great experience. Electron has many benefits - it works well with standard web-based workflows that include JavaScript, HTML and CSS. It also handles the inconsistencies between operating systems to create a uniform application on Windows, MacOS and Linux. On top of this, having access to a user’s file system, makes it so easy to build an application that can work no matter the state of the user’s internet connection. This offers a toolset for a new slew of problems to solve.

If you have experiences working with Electron, I would love to hear your thoughts in the comments below. If you have an application that you need built, reach out to us! We are always looking for great partners.