Upgrade to Pro — share decks privately, control downloads, hide ads and more …

10 things to know about Electron

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Kevin Sawicki Kevin Sawicki
April 23, 2016
Technology
520
1

10 things to know about Electron

Presented at DevPulseCon on April 23rd, 2016.

http://devpulsecon.squarespace.com

Avatar for Kevin Sawicki

Kevin Sawicki

April 23, 2016

More Decks by Kevin Sawicki

See All by Kevin Sawicki
Electron 1.0
Avatar for Kevin Sawicki kevinsawicki
1
360
Testing your Electron apps with ChromeDriver
Avatar for Kevin Sawicki kevinsawicki
4
17k
The History of Electron
Avatar for Kevin Sawicki kevinsawicki
4
9.2k
Atom: 10 things to know about your new text editor
Avatar for Kevin Sawicki kevinsawicki
2
1.3k
Atom: your text editor for the next 50 years
Avatar for Kevin Sawicki kevinsawicki
0
170

Other Decks in Technology

See All in Technology
oracle-to-databricks-migration-with-llm-and-dbt
Avatar for case-k-git casek
0
290
脅威をエンジニアリングの糧にして：恐怖を乗り越えた先にあったもの / Turn threats into fuel for engineering: what lay beyond overcoming fear
Avatar for nrs nrslib
1
330
Spring AI × MCP 入門〜AIエージェントへのツール公開、境界設計から始める最小構成 〜
Avatar for 宮本裕也 yuyamiyamoto
0
140
Amazon CloudFrontにおけるAIボットアクセス制御のポイント
Avatar for t.kizawa kizawa2020
4
290
Claude Codeですべての日常業務を爆速化しよう！
Avatar for みのるん minorun365
PRO
16
14k
『家族アルバム みてね』における インシデント対応との向き合い方 / Approach incident response in Family Album
Avatar for kohbis kohbis
2
230
Spring Boot における​ AOT Cache 活用テクニックと​ 起動時間改善事例​
Avatar for NTTドコモソリューションズ　Java担当 ntt_dsol_java
0
150
AIガバナンス実践 - 生成AIコネクタのデータ漏洩リスクと実務対策
Avatar for 西岡 賢一郎 (Kenichiro Nishioka) knishioka
0
110
インフラが苦手でも大丈夫！ 紙芝居 Kubernetes -WWGT 10周年編-
Avatar for Aoi Takahashi aoi1
1
270
OpenID Connectによるサービス間連携
Avatar for Shigeki Shoji takesection
0
130
自作エディターをOSSにして分かった、一人に刺さる開発が世界を動かす理由
Avatar for Shinya Saita shinyasaita
1
440
GitHub Copilot CLI の Rubber Duck 機能を使ってコーディングの品質をあげよう #techbaton_findy
Avatar for すてにゃん stefafafan
2
1.2k

Featured

See All Featured
Fireside Chat
Avatar for paigeccino paigeccino
42
3.9k
16th Malabo Montpellier Forum Presentation
Avatar for AKADEMIYA2063 akademiya2063
PRO
0
130
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
160
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
41
2.5k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
Avatar for Aleyda Solis aleyda
2
11k
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.2k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.7k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
120k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
59
6.6k

Transcript

  1. 10 THINGS TO KNOW ABOUT ELECTRON

  2. KEVIN SAWICKI GITHUB @KEVINSAWICKI [email protected]

  3. None

  4. WHAT IS ELECTRON? #1

  5. BUILD CROSS PLATFORM DESKTOP APPS WITH WEB TECHNOLOGIES http://electron.atom.io WHAT

    IS ELECTRON?
  6. None
  7. None

  8. 5.10 49.0

  9. None

  10. WHO IS ELECTRON FOR? #2

  11. IF YOU CAN BUILD A WEBSITE, YOU CAN BUILD A

    DESKTOP APP

  12. FREE, OPEN SOURCE STARTED BY GITHUB RELEASED 02/2014

  13. THE HARD PARTS MADE EASY

  14. HOW DOES ELECTRON WORK? #3

  15. main process

  16. main process node

  17. main process menu tray dialog node

  18. main process menu tray dialog window renderer process node ipc

  19. main process menu tray dialog window renderer process node DOM

    node ipc

  20. main process menu tray dialog window window window renderer process

    node DOM renderer process renderer process node DOM node DOM node ipc

  21. HOW DOES YOUR ELECTRON WORK? #4

  22. ELECTRON IS NOT PRESCRIPTIVE

  23. None

  24. REACT? BABEL? BROWSERIFY? GO FOR IT!

  25. ANGULAR? BOOTSTRAP? WEBPACK? GO FOR IT!

  26. OR ENJOY THE PURITY OF CHROME

  27. CUSTOM ELEMENTS? CSS VARIABLES? ES6? GO FOR IT!

  28. USE ANY OF THE 273,000 PACKAGES ON NPM

  29. YOU CHOOSE WHEN TO UPGRADE

  30. ELECTRON APPS FEEL NATIVE #5

  31. None

  32. TRAY API

  33. TRAY API FRAMELESS WINDOW

  34. TRAY API FRAMELESS WINDOW TRANSPARENT WINDOW

  35. TRAY API FRAMELESS WINDOW NOTIFICATIONS TRANSPARENT WINDOW

  36. TRAY API FRAMELESS WINDOW NOTIFICATIONS PHOTON CSS TOOLKIT TRANSPARENT WINDOW

  37. None
  38. None

  39. ★ 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

  40. ELECTRON MAKES DEBUGGING EASY #6

  41. JAVASCRIPT DEBUGGER

  42. RENDER TIMELINE

  43. HEAP SNAPSHOTS

  44. BUNDLE AND SHIP ADDITIONAL EXTENSIONS

  45. ELECTRON CAN BE TEST DRIVEN #7

  46. ELECTRON SUPPORTS WEBDRIVER & CHROMEDRIVER

  47. WEBDRIVER IS AN OPEN SOURCE TOOL FOR AUTOMATED TESTING OF

    WEB APPS ACROSS MANY BROWSERS. ChromeDriver docs WHAT IS WEBDRIVER?

  48. CHROMEDRIVER IS A STANDALONE SERVER WHICH IMPLEMENTS WEBDRIVER'S WIRE PROTOCOL

    FOR CHROMIUM. ChromeDriver docs WHAT IS CHROMEDRIVER?
  49. None

  50. ELECTRON APPS ARE OUT THERE #8

  51. SLACK NYLAS N1 ATOM VISUAL STUDIO CODE

  52. WEBTORRENT DESKTOP

  53. ★ Streaming torrent client implemented in JavaScript ★ Uses WebRTC

    for peer connections ★ Free and open source

  54. JIBO

  55. None

  56. ELECTRON HAS AN AMAZING COMMUNITY #9

  57. ★ 350 CONTRIBUTORS ★ 1,600 PULL REQUESTS ★ 27,000 STARS

    ★ 2,800 FORKS ★ 850 PACKAGES ON NPM

  58. NATIVEFIER

  59. SINDRESORHUS/AWESOME-ELECTRON

  60. BAY AREA ELECTRON USER GROUP MAY 25TH @ 6:30 PM

    MICROSOFT SF OFFICE HTTP://WWW.MEETUP.COM/BAY-AREA-ELECTRON-USER-GROUP

  61. ELECTRON IS GOING 1.0 #10

  62. API STABILITY

  63. MORE APIS

  64. BETTER DOCS

  65. BETTER TOOLS

  66. None

  67. THANKS! HTTP://ELECTRON.ATOM.IO HTTP://GITHUB.COM/ELECTRON @ELECTRONJS