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
Web技術 で デスクトップアプリ !!? 〜 Electron のすすめ〜
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
RYOTA
December 05, 2022
280
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Web技術 で デスクトップアプリ !!? 〜 Electron のすすめ〜
RYOTA
December 05, 2022
More Decks by RYOTA
See All by RYOTA
Webの基本のキ
weberyota
0
63
高卒エンジニアがMBAを受講してみた
weberyota
0
120
“効率的”とは
weberyota
0
160
人を集める
weberyota
0
83
ブロックチェーンを活用したスキル証明技術.pdf
weberyota
0
410
Featured
See All Featured
The #1 spot is gone: here's how to win anyway
tamaranovitovic
2
1.1k
New Earth Scene 8
popppiees
3
2.3k
Building AI with AI
inesmontani
PRO
1
1.1k
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
1
200
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
410
The Cult of Friendly URLs
andyhume
79
6.9k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
200
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
34
2.8k
The Spectacular Lies of Maps
axbom
PRO
1
790
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
270
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
200
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
Transcript
RYOTA 〜 Electron のすすめ〜 Web技術 で デスクトップアプリ !!?
RYOTA 経歴 D 大手重工業 工場作業員(5年2 D 大手人材系企業 営業マン
(3年2 D Webエンジニア (3年2 D フリーランスエンジニア (現在)
RYOTA 技術スタック
お話しする内容 ) Electronと% ) Electronの実行環 ) Electronのプロセスモデル
What' s Electron?
Web技術でデスクトップアプリが作れる
クロスプラットフォーム アプリケーション ※Linux OSにも対応
Electron製アプリ ※代表作
Runtime Node.js Chromium
※Vue.js等も使用可能 Electronが起動 Chromiumが駆動 HTML/CSS/JavaScriptをロード Reactをレンダリング Node.js環境で実行
実際にやってみた
$ yarn start
/index.js /index.html /package.json
Process Model Main Process Renderer Process
メインプロセス 9 アプリケーションのエンドポイントとして機& 9 アプリケーションのライフサイクルを管 9 アプリケーションウィンドウを作成し管 9 ネイティブ機能を制御
レンダラー プロセス レンダラー プロセス レンダラー プロセス メインプロセス IPC 通信 (InterProcess
Communication)
まとめ Web技術でデスクトップが作れる Node.js環境で実行、内部でChromiumが駆動 ネイティブ機能 / 中枢機能をメインプロセスが担う
Thank you !!