Going Desktop with Electron

Leo Lindhorst@DevWurm

Working StudentSoftware Development

What do we target?

MobileDesktop

Web Apps

But ...

Limited offline functionality

Little system access

Reduced user awareness

Limited system integration

Solutions

Mobile Desktop

Framework for building native desktop apps with web technologies

Linux, MacOS, Windows

Open Source project by GitHub

Chromium

NodeAPIs

Structure

Getting Started

const {app, BrowserWindow} = require('electron');

let win;function createWindow() { // Create the browser window. win = new BrowserWindow(); // and load the index.html of the app. win.loadURL(`file://${__dirname}/index.html`); // Emitted when the window is closed. win.on('closed', () => win = null);}

app.on('ready', createWindow);

Getting Started

electron ./entry.js

Features

Native App Full-featured system access

App packages and installers

Keyboard shortcuts

System dialogues

Native menu, tray and notification

integration

...

Provide protocol handlers

Latest Feature

Apple MacBook Touch Bar support

Examples

Atom (Editor)

Examples

Postman (REST Client)

Examples

GitKraken (Git Client)

Just plain Web Technologies?

SPA Frameworks with Electron

Powerful and progressive

frontend frameworks

Full-featured native integrations

Vibrant ecosystem

Angular & Electron

Integration of the Angular-CLI Setup with Electron

https://www.sogehtsoftware.de/blog/post/building-cross-platform-desktop-apps-with-angular-2-and-electron

→ Streamlined and feature-rich development environment for Desktop Apps

https://github.com/DevWurm/angular-2-electron-seed

ElectronMicroscope

Problems

Most Web UI-Toolkits are optimized for mobile

Version conflicts and misbehavior of frameworks and libraries occur more

often and get fixed lately

(Re-)Configurations of frameworks and tools are sometimes “hacky”

Conclusion

Ideal if you can reuse code (Additional web app, web tech based mobile app)

Good solution if you are focused on web development, but native

features are required

In some cases not as powerful as native-only frameworks

Conclusion

It depends

Thank you@DevWurm