$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
10 things to know about Electron
Search
Kevin Sawicki
April 23, 2016
Technology
1
500
10 things to know about Electron
Presented at DevPulseCon on April 23rd, 2016.
http://devpulsecon.squarespace.com
Kevin Sawicki
April 23, 2016
Tweet
Share
More Decks by Kevin Sawicki
See All by Kevin Sawicki
Electron 1.0
kevinsawicki
1
360
Testing your Electron apps with ChromeDriver
kevinsawicki
4
17k
The History of Electron
kevinsawicki
4
9.1k
Atom: 10 things to know about your new text editor
kevinsawicki
2
1.3k
Atom: your text editor for the next 50 years
kevinsawicki
0
150
Other Decks in Technology
See All in Technology
S3を正しく理解するための内部構造の読解
nrinetcom
PRO
3
170
Databricks向けJupyter Kernelでデータサイエンティストの開発環境をAI-Readyにする / Data+AI World Tour Tokyo After Party
genda
1
560
AIエージェント開発と活用を加速するワークフロー自動生成への挑戦
shibuiwilliam
4
310
Identity Management for Agentic AI 解説
fujie
0
110
JEDAI認定プログラム JEDAI Order 2026 エントリーのご案内 / JEDAI Order 2026 Entry
databricksjapan
0
140
コンテキスト情報を活用し個社最適化されたAI Agentを実現する4つのポイント
kworkdev
PRO
1
1.6k
OCI Oracle Database Services新機能アップデート(2025/09-2025/11)
oracle4engineer
PRO
1
210
30分であなたをOmniのファンにしてみせます~分析画面のクリック操作をそのままコード化できるAI-ReadyなBIツール~
sagara
0
180
ExpoのインダストリーブースでみたAWSが見せる製造業の未来
hamadakoji
0
150
Sansanが実践する Platform EngineeringとSREの協創
sansantech
PRO
2
940
MariaDB Connector/C のcaching_sha2_passwordプラグインの仕様について
boro1234
0
910
チーリンについて
hirotomotaguchi
6
2.1k
Featured
See All Featured
Build your cross-platform service in a week with App Engine
jlugia
234
18k
Large-scale JavaScript Application Architecture
addyosmani
515
110k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Raft: Consensus for Rubyists
vanstee
141
7.2k
Context Engineering - Making Every Token Count
addyosmani
9
540
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
57
37k
Designing for humans not robots
tammielis
254
26k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
390
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.3k
Music & Morning Musume
bryan
46
7k
Transcript
10 THINGS TO KNOW ABOUT ELECTRON
KEVIN SAWICKI GITHUB @KEVINSAWICKI
[email protected]
None
WHAT IS ELECTRON? #1
BUILD CROSS PLATFORM DESKTOP APPS WITH WEB TECHNOLOGIES http://electron.atom.io WHAT
IS ELECTRON?
None
None
5.10 49.0
None
WHO IS ELECTRON FOR? #2
IF YOU CAN BUILD A WEBSITE, YOU CAN BUILD A
DESKTOP APP
FREE, OPEN SOURCE STARTED BY GITHUB RELEASED 02/2014
THE HARD PARTS MADE EASY
HOW DOES ELECTRON WORK? #3
main process
main process node
main process menu tray dialog node
main process menu tray dialog window renderer process node ipc
main process menu tray dialog window renderer process node DOM
node ipc
main process menu tray dialog window window window renderer process
node DOM renderer process renderer process node DOM node DOM node ipc
HOW DOES YOUR ELECTRON WORK? #4
ELECTRON IS NOT PRESCRIPTIVE
None
REACT? BABEL? BROWSERIFY? GO FOR IT!
ANGULAR? BOOTSTRAP? WEBPACK? GO FOR IT!
OR ENJOY THE PURITY OF CHROME
CUSTOM ELEMENTS? CSS VARIABLES? ES6? GO FOR IT!
USE ANY OF THE 273,000 PACKAGES ON NPM
YOU CHOOSE WHEN TO UPGRADE
ELECTRON APPS FEEL NATIVE #5
None
TRAY API
TRAY API FRAMELESS WINDOW
TRAY API FRAMELESS WINDOW TRANSPARENT WINDOW
TRAY API FRAMELESS WINDOW NOTIFICATIONS TRANSPARENT WINDOW
TRAY API FRAMELESS WINDOW NOTIFICATIONS PHOTON CSS TOOLKIT TRANSPARENT WINDOW
None
None
★ TAKE SCREENSHOTS ★ ACCESS MICROPHONE AND CAMERA ★ NATIVE
OPEN, SAVE, MESSAGE DIALOGS ★ ADD CONTEXT AND SYSTEM MENUS ★ REGISTER GLOBAL KEYBOARD SHORTCUTS ★ PREVENT SLEEP MODE ★ REPORT CRASHES
ELECTRON MAKES DEBUGGING EASY #6
JAVASCRIPT DEBUGGER
RENDER TIMELINE
HEAP SNAPSHOTS
BUNDLE AND SHIP ADDITIONAL EXTENSIONS
ELECTRON CAN BE TEST DRIVEN #7
ELECTRON SUPPORTS WEBDRIVER & CHROMEDRIVER
WEBDRIVER IS AN OPEN SOURCE TOOL FOR AUTOMATED TESTING OF
WEB APPS ACROSS MANY BROWSERS. ChromeDriver docs WHAT IS WEBDRIVER?
CHROMEDRIVER IS A STANDALONE SERVER WHICH IMPLEMENTS WEBDRIVER'S WIRE PROTOCOL
FOR CHROMIUM. ChromeDriver docs WHAT IS CHROMEDRIVER?
None
ELECTRON APPS ARE OUT THERE #8
SLACK NYLAS N1 ATOM VISUAL STUDIO CODE
WEBTORRENT DESKTOP
★ Streaming torrent client implemented in JavaScript ★ Uses WebRTC
for peer connections ★ Free and open source
JIBO
None
ELECTRON HAS AN AMAZING COMMUNITY #9
★ 350 CONTRIBUTORS ★ 1,600 PULL REQUESTS ★ 27,000 STARS
★ 2,800 FORKS ★ 850 PACKAGES ON NPM
NATIVEFIER
SINDRESORHUS/AWESOME-ELECTRON
BAY AREA ELECTRON USER GROUP MAY 25TH @ 6:30 PM
MICROSOFT SF OFFICE HTTP://WWW.MEETUP.COM/BAY-AREA-ELECTRON-USER-GROUP
ELECTRON IS GOING 1.0 #10
API STABILITY
MORE APIS
BETTER DOCS
BETTER TOOLS
None
THANKS! HTTP://ELECTRON.ATOM.IO HTTP://GITHUB.COM/ELECTRON @ELECTRONJS