Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Electron Workshop - Shanghai 2016
Search
Cheng Zhao
October 14, 2016
Programming
0
230
Electron Workshop - Shanghai 2016
The slides for the Electron workshop at Shanghai HACK×FDU.
Cheng Zhao
October 14, 2016
Tweet
Share
More Decks by Cheng Zhao
See All by Cheng Zhao
Electron.js in 2019 (中文/Simplified Chinese)
zcbenz
0
330
Electron Now
zcbenz
2
660
Electron Now(日本語)
zcbenz
3
930
a community story of Electron
zcbenz
0
180
Evolution of Electron - NodeFest 2016
zcbenz
7
15k
Practice on embedding Node.js into Atom Editor
zcbenz
24
10k
node-webkit: app runtime based on Chromium and node.js
zcbenz
248
190k
Other Decks in Programming
See All in Programming
OnlineTestConf: Test Automation Friend or Foe
maaretp
0
120
Streams APIとTCPフロー制御 / Web Streams API and TCP flow control
tasshi
2
350
.NET のための通信フレームワーク MagicOnion 入門 / Introduction to MagicOnion
mayuki
1
1.7k
Remix on Hono on Cloudflare Workers
yusukebe
1
300
聞き手から登壇者へ: RubyKaigi2024 LTでの初挑戦が 教えてくれた、可能性の星
mikik0
1
130
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
120
watsonx.ai Dojo #4 生成AIを使ったアプリ開発、応用編
oniak3ibm
PRO
1
150
카카오페이는 어떻게 수천만 결제를 처리할까? 우아한 결제 분산락 노하우
kakao
PRO
0
110
NSOutlineView何もわからん:( 前編 / I Don't Understand About NSOutlineView :( Pt. 1
usagimaru
0
340
Jakarta EE meets AI
ivargrimstad
0
150
Functional Event Sourcing using Sekiban
tomohisa
0
100
Enabling DevOps and Team Topologies Through Architecture: Architecting for Fast Flow
cer
PRO
0
340
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1030
460k
How STYLIGHT went responsive
nonsquared
95
5.2k
Intergalactic Javascript Robots from Outer Space
tanoku
269
27k
How to Ace a Technical Interview
jacobian
276
23k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
GraphQLとの向き合い方2022年版
quramy
43
13k
Designing Experiences People Love
moore
138
23k
Embracing the Ebb and Flow
colly
84
4.5k
Become a Pro
speakerdeck
PRO
25
5k
Transcript
ᵭত ԟᖫٟELECTRONଫአ ELECTRON WORKSHOP 2016 SHANGHAI
ELECTRON WORKSHOP ىԭ౯ ▸ ᩶౮ ▸ ڠ᭜ԧElectronຝ ▸ ࣁGitHubૡ֢ ▸
ཻᬨىဳғhttps://github.com/zcbenz
ELECTRON WORKSHOP ᬯེWORKSHOPጱፓຽ ▸ ԧᥴElectronጱचᏐᎣᦩ ▸ ൫ୌঅᖫٟElectronଫአጱሾह ▸ ԟElectronଫአጱचຝ ▸
ᛔ૩ᖫٟӞӻElectronଫአ
ELECTRON WORKSHOP ▸ Electronݢզਖ਼ᗑᶭ۱౮ໟᶎଫአ ▸ ֵአChromium֢ԅක ▸ رᦜࣁᗑᶭӾֵአNode.js ▸ ׀ԧӞॺJavaScript
APIӨᔮᕹԻ ՋԍฎELECTRON
ELECTRON WORKSHOP ग़ᬰᑕຝ Ԇᬰᑕ ᗑᶭ ᗑᶭ … … …
ELECTRON WORKSHOP ֵአNODE.JSഴګݱӻᬰᑕ Ԇᬰᑕ ᗑᶭ … … … Node.js Node.js
Node.js ᗑᶭ Node.js
ELECTRON WORKSHOP ᗑᶭԏᳵፘᵍᐶ҅ԆᬰᑕᗑᶭአIPC᭗מ Ԇᬰᑕ ᗑᶭ … … … Node.js Node.js
Node.js ᗑᶭ Node.js IPCᬰᑕᳵ᭗מ
ELECTRON WORKSHOP ਞᤰELECTRONጱٵ॓ૡ֢ ▸ ਞᤰNode.js ▸ ਥᗑғ https://nodejs.org/en/ ▸ Ӿࢵ᳒؟ғ
https://npm.taobao.org/mirrors/node/ v6.7.0/
ELECTRON WORKSHOP ਞᤰELECTRON npm config set registry https://registry.npm.taobao.org set ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/
npm install -g electron ▸ Ӿࢵ᳒؟ӥғ https://npm.taobao.org/mirrors/ electron/1.4.3/ ▸ ᘏեᤈӥғ
ELECTRON WORKSHOP ELECTRON
ELECTRON WORKSHOP ӥQUICK START ▸ https://github.com/electron/electron-quick-start ▸ ӥZIPկғ
ELECTRON WORKSHOP QUICK START ೫
ELECTRON WORKSHOP QUICK START
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js { "name":"electron-quick-start",
"version":"0.0.1", "main":"main.js" } ଫአጱݷᑍ ଫአጱᇇ ଫአጱفݗկ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) አElectronཛྷࣘ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) ؙਂᑻݗጱݒᰁ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) ڠୌӞӻᑻݗ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) ࣁᑻݗٖف୮ڹፓ୯ӥጱindex.html
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) ݎᘏૡٍ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js const electron
= require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow let mainWindow function createWindow () { mainWindow = new BrowserWindow({ width: 800, height: 600 }) mainWindow.loadURL(`file://${__dirname}/index.html`) mainWindow.webContents.openDevTools() } app.on('ready', createWindow) ࣁଫአفਠ౮ڠୌᑻݗ
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js <body> <h1>Hello
World!</h1> We are using node <script> document.write(process.versions.node) </script> </body> <script> require('./renderer.js') </script>
ELECTRON WORKSHOP ELECTRONଫአጱचᕮ quick-start package.json main.js index.html renderer.js // ᬯӻկ᯾ᶎՋԍ᮷ဌํ֦҅ݢզࣁᬯ᯾ᶎֵአNode.jsጱAPI
ELECTRON WORKSHOP ۱ELECTRONଫአ ▸ ਞᤰelectron-packagerғ npm install -g electron-packager electron-packager
. --platform=win32 --arch=x64 —version=1.4.3 ▸ ۱
ᨀᨀ