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
280
Electron Now
zcbenz
2
630
Electron Now(日本語)
zcbenz
3
860
a community story of Electron
zcbenz
0
170
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
CircleCIを活用して AWSへの継続的デリバリーを 実践する
coconala_engineer
1
230
Elm 0.19.0 Changes
bkuhlmann
0
480
StreamlitとTerraformでデータカタログを作った話
gussan0223
0
290
App Router への移行は「改善」となり得るのか?/ Can migration to App Router be an improvement
takefumiyoshii
8
2.1k
Ruby製社内ツールのGo移行
bgpat
2
330
OpenTelemetry のサービスという概念について
azukiazusa1
2
1.1k
try!Swift Tokyo 2024 参加報告 LT
akidon0000
1
190
Git Rebase
bkuhlmann
11
1.6k
HUIT新歓2024「競技プログラミング、やってみませんか?」
slephy2784
1
250
AWS Application Composerで始める、 サーバーレスなデータ基盤構築 / 20240406-jawsug-hokuriku-shinkansen
kasacchiful
1
250
品質とスピードを両立: TypeScriptの柔軟な型システムをバックエンドで活用する
kosui
8
2.2k
Folding Cheat Sheet #3
philipschwarz
PRO
0
110
Featured
See All Featured
Unsuck your backbone
ammeep
662
57k
Building Applications with DynamoDB
mza
88
5.6k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
185
16k
Into the Great Unknown - MozCon
thekraken
10
980
Designing for humans not robots
tammielis
247
25k
From Idea to $5000 a Month in 5 Months
shpigford
377
45k
Debugging Ruby Performance
tmm1
69
11k
A Tale of Four Properties
chriscoyier
150
22k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
39
4.4k
Teambox: Starting and Learning
jrom
128
8.4k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
6
990
Six Lessons from altMBA
skipperchong
19
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 ▸ ۱
ᨀᨀ