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
220
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
320
Electron Now
zcbenz
2
650
Electron Now(日本語)
zcbenz
3
920
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
Android 15 でアクションバー表示時にステータスバーが白くなってしまう問題
tonionagauzzi
0
140
詳細解説! ArrayListの仕組みと実装
yujisoftware
0
480
CPython 인터프리터 구조 파헤치기 - PyCon Korea 24
kennethanceyer
0
240
僕がつくった48個のWebサービス達
yusukebe
18
17k
CSC305 Lecture 13
javiergs
PRO
0
130
Vue.js学習の振り返り
hiro_xre
2
130
PLoP 2024: The evolution of the microservice architecture pattern language
cer
PRO
0
1.6k
WEBエンジニア向けAI活用入門
sutetotanuki
0
300
Modern Angular: Renovation for Your Applications
manfredsteyer
PRO
0
210
CSC509 Lecture 09
javiergs
PRO
0
110
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
360
From Subtype Polymorphism To Typeclass-based Ad hoc Polymorphism- An Example
philipschwarz
PRO
0
170
Featured
See All Featured
How GitHub (no longer) Works
holman
311
140k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
3
370
Testing 201, or: Great Expectations
jmmastey
38
7k
Making Projects Easy
brettharned
115
5.9k
Designing on Purpose - Digital PM Summit 2013
jponch
115
6.9k
Learning to Love Humans: Emotional Interface Design
aarron
272
40k
How STYLIGHT went responsive
nonsquared
95
5.2k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
4
290
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
32
1.8k
BBQ
matthewcrist
85
9.3k
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 ▸ ۱
ᨀᨀ