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+Vue+Swift=真のデスクトップアプリ / How to create ...
Search
果物リン
October 22, 2024
0
57
Electron+Vue+Swift=真のデスクトップアプリ / How to create "Really" desktop app using Electron
ちょっと盛ったかもしれないけど
ElectronにAPIがないからって諦めないデスクトップアプリ開発の話
果物リン
October 22, 2024
Tweet
Share
More Decks by 果物リン
See All by 果物リン
ある日オレオレフレームワークを作りたくなったぞ/Want to Create Oreore Framework
fruitriin
1
110
fishとfzfはじめて 豊かになりました / fish and fzf is good
fruitriin
1
830
Chrome Devtools使いこなしたい/I want to master devtool
fruitriin
3
1.5k
Event Stage - 真面目に作ったけど 全くウケなくてクソだったアプリ/I made new service but they say shit
fruitriin
0
160
読み上げチャット+映像配信サービス作ってるけど…/I develop Text-to-Speach chat and broadcast Savice but...
fruitriin
0
130
とある自社開発の苦楽の軌跡/Trajectory of a Certain In-house Development Effort
fruitriin
1
240
動画再生速度を変更するコンポーネントを作ろうとして諦めた話/talk about give up to create video with playback-rate controller
fruitriin
6
920
Soft Skillsから伝えたい新人時代の個人開発技術選定/Selecting Stack for Personal Development as a from Soft Skills
fruitriin
2
350
SFCで挑戦するFunctional Component/Functional Component Challenge at SFC
fruitriin
3
1.5k
Featured
See All Featured
It's Worth the Effort
3n
184
28k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Fontdeck: Realign not Redesign
paulrobertlloyd
84
5.5k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
VelocityConf: Rendering Performance Case Studies
addyosmani
329
24k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
GraphQLとの向き合い方2022年版
quramy
46
14k
Speed Design
sergeychernyshev
30
980
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
1
96
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.6k
Transcript
Electron+Vue++Swift = 真のデスクトップアプリ ՌϦϯ@fruitriin@misskey.systems Misskey.systems
ʢλΠτϧʣ ͍ͩͿ͔ͬͨ͠Εͳ͍
自己紹介@果物リン • ͘Β͍ແ৬ͱ͍͏ࣗ༝ΛᨳՎத • Vue͕͖Ͱͨ·Βͳ͍ • Misskey.systems͔Β͖·ͨ͠ • ͜Εʹ͍͍ͭͯͬͺ͍͍͚ͨ͠Ͳ
こんなアプリ作ってます ࡞ Taskbar.fm
ElectronͰ͢
(おさらい)Electron • BrowserViewͱσεΫτοϓAPIୟ͚Δ܅ͷηοτ • ͜Ε͑͋͞ΕWebΤϯδχΞͷ͋ͳͨ σεΫτοϓΞϓϦ͕࡞ΕͪΌ͍·͢ʂ
πʔϧόʔ࡞Γ͍ͨͳ͋
ϓϩηεͷϦετ͕΄͍͠ͳ͋
None
APIΓͳ͘ͳ͍……ʁ
None
ݟ͑ͳ͍Αʂʼ
ŗŕʂʼ
SwiftͰϓϩηεϦετ ࡞ͬͯऔಘ͢Δ͔
Swift製CLI tool作り方3種類 • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ • swiftc ͰϏϧυ͢Δ • swift build
ͰϏϧυ͢Δ
None
݁ہؾ߹
Nodeから起動して取り扱う • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ
Nodeから起動して取り扱う • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ ݺͼग़ͤΔ
Nodeから起動して取り扱う • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ stdoutΛ͘Εʂ
Nodeから起動して取り扱う • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ stdoutΛ͘Εʂ
Nodeから起動して取り扱う • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ ϑϩϯτΤϯυʹ͛Δͧʂ
こんなアプリ作ってます ࡞ Taskbar.fm
ΊͰͨ͠ΊͰͨ͠
Appendix ʮVueʹ͍ͭͯͷͳ͍ΜͰ͔͢ʂʁʯ
ࢲ͖ʹͨ͠
ElectronViteがいい感じ • xCodeىಈͯ͠ΰϦΰϦͬͱ࡞Δ
ViteならなんでもOK • ࢮ͵΄ͲViteͰϓϩδΣΫτ࡞ͬͨਓʹ ʮ͋ʔɺͳΔ΄ͲͶʯΈ͍ͨͳؾ࣋ͪʹͳ͍ͬͯΔͣ • Vue3ͷඪ४Nuxtͷඪ४ʹͳͬͨϏϧυπʔϧ • Electron ViteͪΖvueΛαϙʔτ
マイカスタマイズ • preloadσΟϨΫτϦআ • electron-toolkit/preload Ͱ͍͍͔ͳ • main/index.tsΛmain.tsʹɺ renderer/index.tsΛrendere.tsʹϦωʔϜ →
ೝࣝෛՙԼ
Ask any Questionʁ