How to get started with Electron

Describe essential knowledge for getting started Electron

Transcript

1. ੌ۩౟ۿ द੘ೠ׮Ҋ ੹೧ۄ how to get started with Electron @ragingwind electron-kr
3. Build - Electron: Desktop Apps with Web Languages - http://goo.gl/K6pAiO
6. Web Tech Use HTML, CSS, and JavaScript with Chromium and Node.js to build your app - Any Web Frameworks and Libraries - React, AngularJS, Polymer, WinJS, jQuery, Bootstrap, Photonkit … - Node integration issue [1], [2] - Latest Chromium via libchromiumcontent - Chromium Content API, Webkit API(V8) - Bumped new stable Chrome version within one or two weeks after release - Chromium: v47.0.2526.110, V8: v4.7.80.27 - Stable and Latest APIs on Node.js - Upgrading after a month to avoid bugs - Ready to latest features going with V8 upgrades - v5.1.1 (Node.js stable v5.4.1) - ES2015 shipping features is default - Supporting from over 200,000 npm packages by Electron v0.36.4 -2016/01/16
7. Polymer Starter Kit https://github.com/electron-kr/electron-psk-boilerplate
8. WinJS + React https://github.com/felixrieseberg/electron-windows-sample
9. Photonkit http://react-photonkit.github.io
10. Eddystone (Beacon) https://goo.gl/cCsUIj
11. Open Source Electron is open source; maintained by GitHub and an active community - Github !!! - Supporting from powerful-big-vendors - Many of Open source apps as a sample - Got blessed by npm module developers
16. awesome-electron by Sindre Sorhus https://github.com/sindresorhus/awesome-electron#open-source
18. Yeoman Official Generator
 built on top of Electron https://github.com/yeoman/yeoman-app
19. Cross Platform Electron apps build and run on Mac, Windows, and Linux - One-stop build for Electron apps - Auto update
 except Linux so far - MAS (Mac App Store) Submission - ARM devices support - Platform features
21. - Squirrel/Squirrel.Windows · GitHub - https://goo.gl/O6nvbb
 - Squirrel/Squirrel.Mac: Cocoa framework for updating OS X apps - https://goo.gl/DvnGsa - atom/grunt-electron-installer: Grunt plugin to build Windows installers for Electron apps - https://goo.gl/1KerLO
24. Desktop Environment Integration
26. Electron Somethings we should know - Node.js, npm - Web technologies - Platform features - Electron Architecture - Running Electron app - Debugging and Testing Electron app - Packaging Electron app
27. Practice on embedding Node.js into Atom Editor // Speaker Deck - https://goo.gl/ENyzp9
28. Build - Electron: Desktop Apps with Web Languages - https://goo.gl/uoSpk2
29. Practice on embedding Node.js into Atom Editor // Speaker Deck - https://goo.gl/ENyzp9
30. Electron initialization for browser process
31. Practice on embedding Node.js into Atom Editor // Speaker Deck - https://goo.gl/ENyzp9
32. Electron event loop pseudo sequence
34. Electron Installation Get Electron - Build with source on Mac - Download released files - electron-prebuilt
36. Setup and launch app without source
37. Electron, Hello Hello! - Project tree of Electron App ȍȇȇ index.js ȍȇȇ package.json ȍȇȇ index.html ȍȇȇ index.css ȍȇȇ license Ȍȇȇ readme.md - index.js is MUST. 
 Entry point of Electron app
 - package.json is SHOULD. 
 For dependencies and project info - index.html is.
 for view of Electron app but not requirement
40. Hello world on Electon
45. eddystone-beacon-menubar-scanner - https://goo.gl/1n01iC
46. - Inspector via Chrome Dev Tools - node-inspector for Debugging
 on Main Process - console.log or LOG(INFO) - Automated testing - Chrome Driver for Electron - spectron Electron Testing npm test
47. Testing your Electron apps with ChromeDriver // Speaker Deck - https://goo.gl/meIP9R
50. Test Electron app with spectron and ava
51. Electron Packaging Ready to shipping - Packaging via electron-packager - Installer via electron-builder - Signing helper for MAS - App packaging with asar - Like tar but no extract, random access - Avoiding of exposing app’s source code - Code protection? - Not supporting a way of code protection on Electron - mksnapshot, (V8) Snapshot for Electron - Packaging with asar - Using commercial software for protection - Using edge.js and edge-atom-shell for Windows (Slack) - Using dynamic library loader via node-ffi
52. asar
53. electron-packager . newapp --out=dist --ignore='^/dist$' --prune --asar --all -- version=0.36.5
54. Life is short, boiler-platings are too much
55. Using generator-electron via Yeoman
56. - Well-structured project - Up-to-date features and updates - Neat(-est) source code of boilerplate - Prepared configure and scripts sindresorhus/generator-electron: Scaffold out an Electron app boilerplate - https://goo.gl/rMOGCp
58. Thanks.