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

ComposeでWebアプリを作る技術

Avatar for てべすてん てべすてん
April 18, 2025
Programming
300
0

 ComposeでWebアプリを作る技術

Avatar for てべすてん

てべすてん

April 18, 2025

More Decks by てべすてん

See All by てべすてん
ててべんす独演会〜Flowの全てを語ります〜
Avatar for てべすてん tbsten
1
300
Kotlin の煩雑な データコピーを どうにかする
Avatar for てべすてん tbsten
0
140
脱 Material3 ?! lumo ui の紹介
Avatar for てべすてん tbsten
0
180
衝撃を受けた OSS Androidアプリ
Avatar for てべすてん tbsten
0
230
CameraXとCompose
Avatar for てべすてん tbsten
0
180

Other Decks in Programming

See All in Programming
The Bowling Game - From Imperative to Functional Programming - Part 1
Avatar for Philip Schwarz philipschwarz
PRO
0
310
エンジニア向け会社紹介/Findy Company Profile
Avatar for Findy findyinc
6
360k
過去最大のMCPアップデート! 2026-07-28 RC版の謎に迫る
Avatar for matsukada licux
6
460
鹿野さんに聞く！『TypeScriptコードレシピ集』で磨く実践力
Avatar for tonkotsuboy_com tonkotsuboy_com
4
1.1k
Observability in Practice：Grafana 與 Edge Device SRE 的那些事
Avatar for Blueswen blueswen
0
190
関数型プログラミングのメリットって何だろう？
Avatar for わんこ(Wanko_IT) wanko_it
0
160
言語を使う側から、作る側へ。 自作 Lisp で得た新たな気づき。
Avatar for ANDPAD inc andpad
0
110
霧の中の代数的エフェクト
Avatar for funnycat funnyycat
1
340
Creating Composable Callables in Contemporary C++
Avatar for Björn Fahller rollbear
0
200
Generative UI & AI-Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
1
160
20260623_Loop Engineeringで自分の分身の問い合わせBotを作る
Avatar for ryugen04 ryugen04
0
200
壊れたパーサから始める関数型設計と構成的なパーサ #fp_matsuri
Avatar for ライガー raiga0310
2
200

Featured

See All Featured
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.4k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.8k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.7k
Reality Check: Gamification 10 Years Later
Avatar for Sebastian Deterding codingconduct
0
2.2k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
460
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
Paper Plane
Avatar for Katie Cordina Lindsey katiecoart
PRO
2
52k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
8
36k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
1
430
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k

Transcript

  1. Compose Ͱ Web ΞϓϦΛ࡞Δٕज़ ͯ΂ͯ͢Μ 2025/04/18 Kobweb ͷ঺հ

  2. ࣗݾ঺հ • Android ΤϯδχΞ • גࣜձࣾΏΊΈ • Web ϑϩϯτΤϯυ͸ 55఺͘Β͍

    ͯ΂ͯ͢Μ

  3. ࣗݾ঺հ • Compose, Kotlin ͕େ޷͖ • झຯ • ήςϞϊComposeϥΠϒϥϦͷ঺հ •

    ि3ͰҰਓΧϥΦέ ͯ΂ͯ͢Μ

  4. Compose Ͱ Web αΠτΛ࡞Δٕज़ • Compose Multiplatform • Kobweb 👈

    ࠓ೔࿩͢΍ͭ

  5. Compose Multiplatform (CMP) Compose Λ͍ΖΜͳ Platform Ͱಈ͔ͤΔΑ͏ʹ͢Δ΍ͭ

  6. Compose Multiplatform for Web

  7. Compose Multiplatform for Web • Compose UI ͕ͦͷ··ಈ͘΋ͷ (͜͜Ͱ͸CMP UI)

    ͱ DOM Λग़ྗ͢Δ Compose HTML ͕͋Δ

  8. Compose Multiplatform for Web ͷ࢒೦ϙΠϯτ

  9. Compose Multiplatform ͷ࢒೦ϙΠϯτ • ύϑΥʔϚϯε໰୊ • Kotlin JS ͸ύϑΥʔϚϯε͕࢒೦ •

    ͔ͱ͍ͬͯ Wasm ͸ iOS Ͱಈ͔ͳ͍

  10. Compose Multiplatform ͷ࢒೦ϙΠϯτ • <canvas> ʹϕλॻ͖ • ΞΫηγϏϦςΟ, SEO ໘Ͱෆར

  11. ͨͩ ͜Ε͸࢓ํͳ͍

  12. ʢԶ͕ߟ͑ΔʣCMP ͷ͋Δ΂͖࿦ • CMP ͸ ͍ΖΜͳ Platform Ͱ Compose Λͦͷ··ಈ͔͢

    ͨΊͷٕज़ • ͍ΖΜͳछྨͷΞϓϦΛ࡞ΔͨΊͷٕज़Ͱ͸ͳ͍ • CMP Λ࢖ͬͯ΋ ֤ Platform ʹدΓఴͬͨ "ྑ͍ΞϓϦ" ͸ ࠓ͸࡞Εͳ͍͠ɺকདྷతʹ΋ແཧ • ͦ΋ͦ΋ Platform ͝ͱʹٻΊΒΕΔ UI ͕ҧ͏

  13. Kobweb

  14. Kobweb

  15. Kobweb • Compose HTML ϕʔεͷ Web ΞϓϦΛ࡞ΔϑϨʔϜϫʔΫ • جຊ͸ HTML

    Λॻ͘΋ͷͷɺҰ෦ Compose ෩ʹॻ͘͜ͱ΋Ͱ͖Δ

  16. Kobweb ͱ CMP (͍ΘΏΔ) CMP Compose HTML

  17. Kobweb ͱ CMP Compose HTML

  18. Kobweb ͱ CMP (͍ΘΏΔ) CMP Kobweb

  19. Kobweb ͱ CMP (͍ΘΏΔ) CMP Kobweb

  20. Kobweb ͱ CMP Kobweb

  21. Kobweb ͱ CMP

  22. ·ͱΊ • Compose Multiplatform for Web Ͱ Web αΠτ͸ࣙΊͱ͚ •

    CMP ͕ద͢ΔΞϓϦ͸͋Δ͕ɺWeb αΠτͱͯ͠ͷΫΦϦςΟ͸ མͪΔ • Compose × Web ΞϓϦ͸ Kobweb ͕Ξπ͍

  23. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ