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
160
ComposeでWebアプリを作る技術
てべすてん
April 18, 2025
Tweet
Share
More Decks by てべすてん
See All by てべすてん
脱 Material3 ?! lumo ui の紹介
tbsten
0
110
衝撃を受けた OSS Androidアプリ
tbsten
0
190
CameraXとCompose
tbsten
0
130
Other Decks in Programming
See All in Programming
NPOでのDevinの活用
codeforeveryone
0
250
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
46
31k
LINEヤフー データグループ紹介
lycorp_recruit_jp
0
890
FormFlow - Build Stunning Multistep Forms
yceruto
1
190
CursorはMCPを使った方が良いぞ
taigakono
1
180
Haskell でアルゴリズムを抽象化する / 関数型言語で競技プログラミング
naoya
17
4.9k
Create a website using Spatial Web
akkeylab
0
300
XSLTで作るBrainfuck処理系
makki_d
0
210
エンジニア向け採用ピッチ資料
inusan
0
160
GraphRAGの仕組みまるわかり
tosuri13
8
480
Google Agent Development Kit でLINE Botを作ってみた
ymd65536
2
190
Beyond Portability: Live Migration for Evolving WebAssembly Workloads
chikuwait
0
390
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Thoughts on Productivity
jonyablonski
69
4.7k
The Cost Of JavaScript in 2023
addyosmani
51
8.4k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Code Review Best Practice
trishagee
68
18k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
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 ͕Ξπ͍
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ