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
ComposeでWebアプリを作る技術
Search
てべすてん
April 18, 2025
Programming
0
200
ComposeでWebアプリを作る技術
てべすてん
April 18, 2025
Tweet
Share
More Decks by てべすてん
See All by てべすてん
ててべんす独演会〜Flowの全てを語ります〜
tbsten
1
210
Kotlin の煩雑な データコピーを どうにかする
tbsten
0
83
脱 Material3 ?! lumo ui の紹介
tbsten
0
130
衝撃を受けた OSS Androidアプリ
tbsten
0
200
CameraXとCompose
tbsten
0
150
Other Decks in Programming
See All in Programming
Web技術を最大限活用してRAW画像を現像する / Developing RAW Images on the Web
ssssota
2
630
Чего вы не знали о строках в Python – Василий Рябов, PythoNN
sobolevn
0
140
私はどうやって技術力を上げたのか
yusukebe
6
2k
2025年版 サーバーレス Web アプリケーションの作り方
hayatow
22
24k
WebエンジニアがSwiftをブラウザで動かすプレイグラウンドを作ってみた
ohmori_yusuke
0
160
クラシルを支える技術と組織
rakutek
0
160
階層構造を表現するデータ構造とリファクタリング 〜1年で10倍成長したプロダクトの変化と課題〜
yuhisatoxxx
3
450
Astroの使用感とディレクトリ設計についての考察
saku0109
0
130
メモリ不足との戦い〜大量データを扱うアプリでの実践例〜
kwzr
1
400
SpecKitでどこまでできる? コストはどれくらい?
leveragestech
0
130
ABEMAモバイルアプリが Kotlin Multiplatformと歩んだ5年 ─ 導入と運用、成功と課題 / iOSDC 2025
akkyie
0
240
Navigation 2 を 3 に移行する(予定)ためにやったこと
yokomii
0
450
Featured
See All Featured
Building Adaptive Systems
keathley
43
2.8k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
127
53k
Git: the NoSQL Database
bkeepers
PRO
431
66k
It's Worth the Effort
3n
187
28k
Why Our Code Smells
bkeepers
PRO
339
57k
Thoughts on Productivity
jonyablonski
70
4.8k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Side Projects
sachag
455
43k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
Code Reviewing Like a Champion
maltzj
525
40k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Transcript
Compose Ͱ Web ΞϓϦΛ࡞Δٕज़ ͯͯ͢Μ 2025/04/18 Kobweb ͷհ
ࣗݾհ • Android ΤϯδχΞ • גࣜձࣾΏΊΈ • Web ϑϩϯτΤϯυ 55͘Β͍
ͯͯ͢Μ
ࣗݾհ • Compose, Kotlin ͕େ͖ • झຯ • ήςϞϊComposeϥΠϒϥϦͷհ •
ि3ͰҰਓΧϥΦέ ͯͯ͢Μ
Compose Ͱ Web αΠτΛ࡞Δٕज़ • Compose Multiplatform • Kobweb 👈
ࠓͭ͢
Compose Multiplatform (CMP) Compose Λ͍ΖΜͳ Platform Ͱಈ͔ͤΔΑ͏ʹ͢Δͭ
Compose Multiplatform for Web
Compose Multiplatform for Web • Compose UI ͕ͦͷ··ಈ͘ͷ (͜͜ͰCMP UI)
ͱ DOM Λग़ྗ͢Δ Compose HTML ͕͋Δ
Compose Multiplatform for Web ͷ೦ϙΠϯτ
Compose Multiplatform ͷ೦ϙΠϯτ • ύϑΥʔϚϯε • Kotlin JS ύϑΥʔϚϯε͕೦ •
͔ͱ͍ͬͯ Wasm iOS Ͱಈ͔ͳ͍
Compose Multiplatform ͷ೦ϙΠϯτ • <canvas> ʹϕλॻ͖ • ΞΫηγϏϦςΟ, SEO ໘Ͱෆར
ͨͩ ͜Εํͳ͍
ʢԶ͕ߟ͑ΔʣCMP ͷ͋Δ͖ • CMP ͍ΖΜͳ Platform Ͱ Compose Λͦͷ··ಈ͔͢
ͨΊͷٕज़ • ͍ΖΜͳछྨͷΞϓϦΛ࡞ΔͨΊͷٕज़Ͱͳ͍ • CMP Λͬͯ ֤ Platform ʹدΓఴͬͨ "ྑ͍ΞϓϦ" ࠓ࡞Εͳ͍͠ɺকདྷతʹແཧ • ͦͦ Platform ͝ͱʹٻΊΒΕΔ UI ͕ҧ͏
Kobweb
Kobweb
Kobweb • Compose HTML ϕʔεͷ Web ΞϓϦΛ࡞ΔϑϨʔϜϫʔΫ • جຊ HTML
Λॻ͘ͷͷɺҰ෦ Compose ෩ʹॻ͘͜ͱͰ͖Δ
Kobweb ͱ CMP (͍ΘΏΔ) CMP Compose HTML
Kobweb ͱ CMP Compose HTML
Kobweb ͱ CMP (͍ΘΏΔ) CMP Kobweb
Kobweb ͱ CMP (͍ΘΏΔ) CMP Kobweb
Kobweb ͱ CMP Kobweb
Kobweb ͱ CMP
·ͱΊ • Compose Multiplatform for Web Ͱ Web αΠτࣙΊͱ͚ •
CMP ͕ద͢ΔΞϓϦ͋Δ͕ɺWeb αΠτͱͯ͠ͷΫΦϦςΟ མͪΔ • Compose × Web ΞϓϦ Kobweb ͕Ξπ͍
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ