Those who think it’s just the mobile apps that can be built on hybrid platforms, need to check with the latest developments in the desktop space. The computing arena that lately seemed to be lacking all the luster and appeared to be a daunting task for developers, has revived in style, effectually covering the attainability and applicability gap that used to exist – presenting the possibilities for desktop apps to evolve and advance in their functional capacity and utility value.
As we now have Electron.js to help you build desktop applications across platforms like Windows, Mac, and Linux, allowing developers with great authority and ability to develop rich hybrid applications. Just like you get to work with cross-platform technologies for mobile apps like PhoneGap, Titanium, Xamarin and Sencha – with Electron you get an all-compassing functional environment with a comprehensive set of handy features glued with a great interface to work with on cross-platform desktop applications.
If you think it’s just about building more in less time and at a fewer cost, then that’s not all of it. Electron is far more than just a cross-platform desktop development facility and refers to varied aspects of quality and integrity of desktop development at different levels. With Electron, you get the incredible flexibility to deal with different factors of desktop programming like control, responsiveness and speed when building applications.
The brand new Electron.js is already popular as an inclusive framework for cross-platform desktop app development that cleanly separates front-end from the back-end.
The makers of Electron know that web technology is in trend and developers are more into technologies like JavaScript, HTML, and CSS. Therefore, the platform that was originally built to serve GitHub’s Atom editor, has now become the first choice for the programmers to build desktop applications utilizing their skills in the domain of web.
Further, the reason Electron has the most commercial momentum at the moment, forming the base for Microsoft’s new Visual Studio Code and Slack’s desktop presence – is because of the interactive framework it offers to deal with the routine hitches of application building, allowing you to focus more on the core aspects of your application.
How Electron makes tough tasks easy:
With the AutoUpdater module, you can rapidly launch a multi-platform release server for dispensing out your application with the help of one of these:
Nuts: A nifty release server that uses GitHub as a backend. It allows you to auto-update using Squirrel (Mac & Windows)
Electron-release-server: An all-inclusively featured, self-hosted server for Electron applications. Perfectly works with auto-updater.
Squirrel-updates-server: A simple node.js server that uses GitHub releases for Squirrel (Mac and Windows)
The Menu class comes with the following static methods:
Menu.setApplicationMenu(menu)- allows you to set menu as the application menu
Menu.getApplicationMenu()- allows you to return menu
Menu.sendActionToFirstResponder(action)- you can send the action to the first responder of application using this method
Menu.buildFromTemplate(template)- allows you to return menu referring to the template properties
The Menu object comes with the following instance methods:
menu.popup([browserWindow, x, y, positioningItem])- pops up a menu as a context menu in the BrowserWindow
menu.append(menuItem)- appends the MenuItem to the menu
menu.insert(pos, menuItem)- inserts the MenuItem to the pos-defined position of the menu
This API allows the system to submit crash reports to a remote server. Here, crash reports are saved in a local destination, which is primarily an application-specific temporary directory folder. If you want to look for a productName of YourName, you will find it in a folder named YourName Crashes within the temp directory. The system allows you to change this location by calling the API prior to starting the crash reporter – making it a lot simpler for you to knob and report crashes.
Here’s an example of how you can submit a crash report to a remote server:
const {crashReporter} = require(‘electron’)
crashReporter.start({
productName: ‘YourName’,
companyName: ‘YourCompany’,
submitURL: ‘https://your-domain.com/url-to-submit’,
autoSubmit: true
})
With this API,you can collect tracing data from Chromium’s content module. Here, you would be able to find out performance blocks and operational flaws that hinder and impair different tasks. In this module, you won’t find any interface so you need to open chrome://tracing/ in a Chrome browser. This will allow you to load the created file to be able to view the result.
const{contentTracing}=require(‘electron’)
constoptions={
categoryFilter:’*’,
traceOptions:’record-until-full,enable-sampling’
}contentTracing.startRecording(options,()=>{
console.log(‘Tracing started’)setTimeout(()=>{
contentTracing.stopRecording(”,(path)=>{
console.log(‘Tracing data recorded to ‘+path)
})
},5000)
})
This module includes following methods:
contentTracing.getCategories(callback)- gets you an array of category groups
contentTracing.startRecording(options, callback)- records all processes while allowing you to control what type of tracing is enabled
contentTracing.stopRecording(resultFilePath, callback)- allows you to stop the recording on all processesto help you minimize the runtime overhead
contentTracing.startMonitoring(options, callback)- this allows you to start monitoring on all the processes locally and asynchronously
With electron-winstaller, you can quickly and effortlessly install your app into a machine by generating Windows installer using the electron-winstaller, electron-builder or the grunt-electron-installer package.
Using the Windows Installers (which is generated with Squirrel) you will be able to create a shortcut icon with an Application User Model ID in the format of com.squirrel.PACKAGE_ID.YOUR_EXE_WITHOUT_DOT_EXE.
This can be implemented as com.squirrel.slack.Slack and com.squirrel.code.Code. The same ID needs to be used for your app which needs to be applied with the app.setAppUserModelId API, or Windows won’t be pinning your app correctly in the task bar. Here, you need to keep in mind that the server-side setup in Windows is not the one you get to see with macOS and follow the instructions placed in the guide carefully to get the best results out of it.
All these facilities offered by Electron make it a one-stop solution for cross-platform application development. The platform is vetted with latest development resources and allows you to create applications with virgin JavaScript by offering a runtime with rich native APIs and comprehensive web (GUI) support. Which makes it a highly dependable way to start afresh in a self-assisted environment with minimal dependencies over different support resources. The best part – this technology will soon be reaching a broader vent of offerings and availed by many as it is already out with quick-starter packages to help you speed up development and be more proficient with your approach to building desktop applications.
A marketing graduate, a deemed strategist, a sure geek - Tushar is a fine blender of the art and science of writing. When it comes to tune up content with commerce, he knows the trick. For him, if words don’t make you think and beat, they are not worth your time. A crazy foodie, an unfailing jogger – that’s him off the desk!
Or send us an email at: [email protected]
