$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Web技術 で デスクトップアプリ !!? 〜 Electron のすすめ〜
Search
RYOTA
December 05, 2022
0
240
Web技術 で デスクトップアプリ !!? 〜 Electron のすすめ〜
RYOTA
December 05, 2022
Tweet
Share
More Decks by RYOTA
See All by RYOTA
Webの基本のキ
weberyota
0
42
高卒エンジニアがMBAを受講してみた
weberyota
0
120
“効率的”とは
weberyota
0
140
人を集める
weberyota
0
76
ブロックチェーンを活用したスキル証明技術.pdf
weberyota
0
380
Featured
See All Featured
KATA
mclloyd
PRO
32
15k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
2.9k
Testing 201, or: Great Expectations
jmmastey
46
7.8k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.2k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Producing Creativity
orderedlist
PRO
348
40k
Code Reviewing Like a Champion
maltzj
527
40k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.8k
Documentation Writing (for coders)
carmenintech
76
5.1k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Designing Experiences People Love
moore
142
24k
Mobile First: as difficult as doing things right
swwweet
225
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 !!