Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WebからモバイルへVue.js × Capacitor 活用事例

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for コドモン開発チーム コドモン開発チーム
June 16, 2025
Programming
190
0

WebからモバイルへVue.js × Capacitor 活用事例

Vue.js v-tokyo Meetup #23
https://vuejs-meetup.connpass.com/event/355473/

Avatar for コドモン開発チーム

コドモン開発チーム

June 16, 2025

More Decks by コドモン開発チーム

See All by コドモン開発チーム
ソースコードで比較する React / Vue / Svelte の セキュリティ設計思想 / security design philosophy react vue svelte
Avatar for コドモン開発チーム codmoninc
5
580
少人数SREチームが、長寿なシステムを構築・運用するための取り組み / Efforts by a Small SRE Team to Build and Operate Long-Lived Systems
Avatar for コドモン開発チーム codmoninc
0
18
フルリモートのその先へ〜パパね、いつも家にいるけどちゃんとこうして働いてるよ〜 / Beyond Full Remote
Avatar for コドモン開発チーム codmoninc
0
550
多様な働き方を支えるチーム開発カルチャーと 今後の展望 / Team Development Culture Supporting Diverse Workstyles and Future Outlook
Avatar for コドモン開発チーム codmoninc
0
440
ペアプロ未経験・未知のスキル領域・フルリモートからでも挑戦できる？ 40代転職者の実態 / pair-programming-remote-career-change
Avatar for コドモン開発チーム codmoninc
0
460
EMが「推し本」を語る会〜アジャイルレトロスペクティブズ第2版〜 / recommended-book_agile-retrospectives
Avatar for コドモン開発チーム codmoninc
0
78
段階的なリプレイスを2年続けていたら、 ユーザーのことで悩めるようになっていた話 / Two Years of Incremental Replacement: How We Finally Started Thinking About Our Users
Avatar for コドモン開発チーム codmoninc
1
230
自動テストが巻き起こした開発プロセス・チームの変化 / Impact of Automated Testing on Development Cycles and Team Dynamics
Avatar for コドモン開発チーム codmoninc
3
1.7k
データエンジニアの副業メンバーを受け入れてよかったこと / good points of hiring side job data engineers
Avatar for コドモン開発チーム codmoninc
0
81

Other Decks in Programming

See All in Programming
AIベース静的検査器の偽陽性率を抑える工夫3選
Avatar for Kuniwak orgachem
PRO
4
450
Agentic Elixir
Avatar for Andrea Leopardi whatyouhide
0
450
ローカルLLMでどこまでコードが書けるか / How much code can be written on a local LLM
Avatar for Naoki Kishida kishida
2
340
決定論 vs 確率論：Gemini 3 FlashとTF-IDFを組み合わせた「法規判定エンジン」の構築
Avatar for Shu Kobuchi shukob
0
160
GoogleCloudとterraform完全に理解した
Avatar for Terisuke terisuke
1
190
運転動画を検索可能にする〜Cosmos-Embed1とDatabricks Vector Searchで〜/cosmos-embed1-databricks-vector-search
Avatar for 開発室Graph studio_graph
1
680
20260514 - build with ai 2026 - build LINE Bot with Gemini CLI
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
380
実践ハーネスエンジニアリング：ステアリングループを実例から読み解く / Practical Harness Engineering: Understanding Steering Loops Through Real-World Examples
Avatar for nrs nrslib
5
4.9k
KMP × Kotlin 2.3 - How Android Got Slower While iOS Builds Improved by 47%
Avatar for Ryosuke Shimizu (RIO) rio432
0
160
🦞OpenClaw works with AWS
Avatar for matsukada licux
1
350
Building on Bluesky's AT Protocol with Ruby
Avatar for Kuba Suder mackuba
0
110
サプライチェーン攻撃対策「層を重ねて落ちない壁」を10日間で組み上げた話 #TechLeadConf2026
Avatar for Kashun Yoshida kashewnuts
1
230

Featured

See All Featured
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
Avatar for David Carrasco davidcarrasco
0
130
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
180
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
110
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
183
10k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
38
2.8k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1032
470k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
230k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
Avatar for Marco Roth marcoroth
1
34
Digital Ethics as a Driver of Design Innovation
Avatar for Per Axbom axbom
PRO
1
280
Believing is Seeing
Avatar for Spiro Bolos oripsolob
1
120

Transcript

  1. 2025年6月13日 Naoki Haba Webからモバイルへ Vue.js × Capacitor 活用事例 Vue.js v-tokyo

    Meetup #23

  2. 2 • Naoki Haba • 株式会社 コドモン ソフトウェアエンジニア • Vue

    Fes Japan 2025 コアスタッフ 自己紹介

  3. 3 Capacitorとは何か

  4. 4 Capacitorとは何か

  5. 5 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works

  6. 6 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works

  7. 7 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works

  8. 8 Capacitorとは何か ① Capacitorインストール（今回はiOSのみ） ② プロジェクトのビルド & iOSプラットフォームの追加

  9. 9 Capacitorとは何か ③ ビルドファイルをiOSプロジェクトに同期 & 起動 ④ 起動完了🚀

  10. 10 Capacitorとは何か https://capacitorjs.jp/blog/how-capacitor-works

  11. 11 コドモンにおけるCapacitorの活用事例

  12. 12 すべての先生に 子どもと向き合う 時間と心のゆとりを こんなプロダクトを開発しています メインプロダクトは、保育・教育施設向けWebアプリケーション。 保護者と施設のやり取りを支えるモバイルアプリケーションや、施設職員向けモバイル版 アプリケーション、外部サービスと連携するAPIなども開発しています。

  13. 13 • Flutter • React Native • NativeScript etc.. コドモンにおけるCapacitorの活用事例

  14. 14 コドモンにおけるCapacitorの活用事例

  15. 15 • ビルド速度の課題 • プラグインのメンテナンス継続性 コドモンにおけるCapacitorの活用事例

  16. 16 • ビルド速度の改善 • Apache Cordova との高い互換性 • Live Update

    機能を活用したリリースフロー高速化 コドモンにおけるCapacitorの活用事例

  17. 17 • Web技術（HTML、CSS、JavaScript）を活用して モバイルアプリケーション開発が可能 • Web技術に精通したチームがモバイルアプリ開発に 取り組める まとめ

  18. None