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からモバイルへ Vue.js × Capacitor 活用事例
Search
Naoki Haba
June 12, 2025
Programming
0
930
Webからモバイルへ Vue.js × Capacitor 活用事例
Vue.js v-tokyo Meetup #23
https://vuejs-meetup.connpass.com/event/355473/
Naoki Haba
June 12, 2025
Tweet
Share
More Decks by Naoki Haba
See All by Naoki Haba
Laravel+PHPStanで始める実践的静的解析入門
naokihaba
2
340
技術で挑む保育現場の課題解決 〜コドモンエンジニアの 開発スタイルと取り組み
naokihaba
1
130
Pinia Colada が実現するスマートな非同期処理
naokihaba
4
1.3k
unplugin-vue-routerで実現する Nuxt 風ファイルベースルーティング
naokihaba
1
150
VueUse: 5分で分かる Vue.js 開発の効率化術
naokihaba
5
3.6k
前職でNestJSを採用して得た体験からの学び
naokihaba
0
400
GitHub_Packagesで型情報を共通化したら素晴らしかった件
naokihaba
0
260
チームで始める_テスト文化のススメ
naokihaba
0
800
不具合に立ち向かう テスト戦略 ~ NestJSで作るCI環境 ~
naokihaba
0
540
Other Decks in Programming
See All in Programming
202507_ADKで始めるエージェント開発の基本 〜デモを通じて紹介〜(奥田りさ)The Basics of Agent Development with ADK — A Demo-Focused Introduction
risatube
PRO
6
1.4k
新しいモバイルアプリ勉強会(仮)について
uetyo
1
250
大規模FlutterプロジェクトのCI実行時間を約8割削減した話
teamlab
PRO
0
470
Strands Agents で実現する名刺解析アーキテクチャ
omiya0555
1
120
Reactの歴史を振り返る
tutinoko
1
180
LLMは麻雀を知らなすぎるから俺が教育してやる
po3rin
3
2.1k
MCPで実現できる、Webサービス利用体験について
syumai
7
2.5k
대규모 트래픽을 처리하는 프론트 개발자의 전략
maryang
0
120
AIのメモリー
watany
13
1.4k
オホーツクでコミュニティを立ち上げた理由―地方出身プログラマの挑戦 / TechRAMEN 2025 Conference
lemonade_37
2
460
#QiitaBash TDDで(自分の)開発がどう変わったか
ryosukedtomita
1
360
Dart 参戦!!静的型付き言語界の隠れた実力者
kno3a87
0
190
Featured
See All Featured
Side Projects
sachag
455
43k
How STYLIGHT went responsive
nonsquared
100
5.7k
Faster Mobile Websites
deanohume
308
31k
Building an army of robots
kneath
306
45k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
What's in a price? How to price your products and services
michaelherold
246
12k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Building Adaptive Systems
keathley
43
2.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.3k
Speed Design
sergeychernyshev
32
1.1k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
47
9.6k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Transcript
2025年6月13日 Naoki Haba Webからモバイルへ Vue.js × Capacitor 活用事例 Vue.js v-tokyo
Meetup #23
2 • Naoki Haba • 株式会社 コドモン ソフトウェアエンジニア • Vue
Fes Japan 2025 コアスタッフ 自己紹介
3 Capacitorとは何か
4 Capacitorとは何か
5 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works
6 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works
7 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works
8 Capacitorとは何か ① Capacitorインストール(今回はiOSのみ) ② プロジェクトのビルド & iOSプラットフォームの追加
9 Capacitorとは何か ③ ビルドファイルをiOSプロジェクトに同期 & 起動 ④ 起動完了🚀
10 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works
11 コドモンにおけるCapacitorの活用事例
12 すべての先生に 子どもと向き合う 時間と心のゆとりを こんなプロダクトを開発しています メインプロダクトは、保育・教育施設向けWebアプリケーション。 保護者と施設のやり取りを支えるモバイルアプリケーションや、施設職員向けモバイル版 アプリケーション、外部サービスと連携するAPIなども開発しています。
13 • Flutter • React Native • NativeScript etc.. コドモンにおけるCapacitorの活用事例
14 コドモンにおけるCapacitorの活用事例
15 • ビルド速度の課題 • プラグインのメンテナンス継続性 コドモンにおけるCapacitorの活用事例
16 • ビルド速度の改善 • Apache Cordova との高い互換性 • Live Update
機能を活用したリリースフロー高速化 コドモンにおけるCapacitorの活用事例
17 • Web技術(HTML、CSS、JavaScript)を活用して モバイルアプリケーション開発が可能 • Web技術に精通したチームがモバイルアプリ開発に 取り組める まとめ
None