ElectronBuild desktop apps using javascript

Me

Greg Lamp

● Founder/CTO of Yhat● github.com/glamp

Here I am on the Internet.

Hi, I’m Greg!

- Founded in 2013- HQ in DUMBO- (Mighty) Team of 11

- Investors

Agenda- Intro to Electron- How Yhat uses Electron: Rodeo- Project structure & Hello World- Build our own Chat app

Electron

How it works

You might use Electron

everyday

Use Cases

Single page apps with

long session duration

Shortcut heavy apps

Heavy local file usage

Electron at Yhat

Quick Demo

Under the Hood

I sometimes work on Rodeo.

I work on Rodeo.

First App

Project Structure- Entrypoint / Back-end- Static assets: HTML, js, css- node_modules

node server

node server

Electron backend

Project Structure- Entrypoint / Back-end- Static assets: HTML, js, css- node_modules

Project Structure- Entrypoint / Back-end- Static assets: HTML, js, css- node_modules

node V8

≠electron V8

Gotcha

electron-rebuild

Project Structure- Entrypoint / Back-end- Static assets: HTML, js, css- node_modules

Hello Electron!

Roll your own Chat

Quick Demo

Packaging&

Distribution

Release Steps- Package- Sign- Installer

electron-packager

Release Steps- Package- Sign- Installer

Release Steps- Package- Sign- Installer

nothing...yet

Release Steps- Package- Sign- Installer electron-builder

Auto-Updates

SquirrelAuto-updating framework for native apps

Hey Squirrel, I’m running version

Rodeo v1.1.0!

https://rodeo-auto-update.herokuapp.com?version=1.1.0&platform=osx

There’s a new version. Here’s the link to download it!

{ "version": "1.2.1", "url": "http://yhat.com/Rodeo-v1.2.1-darwin_64.zip"}

Gotchas- Must be a .zip- Must be over https- Must be signed- Testing is a pain

Putting it all together

http://bird-chat.s3.amazonaws.com/BirdChat.dmg

yhat.com/BirdChat

Electron- Build desktop apps in javascript- Makes the hard stuff easy- Check out Rodeo ;)

Thanks!https://github.com/glamp/electron-chat-demo/

https://github.com/glamp/chat-server/

https://github.com/glamp/electron-hello-world

Other Resources● https://github.com/sindresorhus/awesome-electron● http://electron.atom.io/● https://github.com/maxogden/electron-packager● https://www.npmjs.com/package/electron-builder

Appendix