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

Compose Multiplatform 1.0.0

Compose Multiplatform 1.0.0

2021/12/11 Zli 大LTにて発表

Yuta Tomiyama

December 11, 2021
Tweet

More Decks by Yuta Tomiyama

Other Decks in Programming

Transcript

  1. 自己紹介 HN: マヤミト ID: yt8492 会津大学 学部4年 任意の言語でフロントエンドをやる人間が増えてきて楽しいね GitHub: https://github.com/yt8492

    趣味: Kotlin, Twitter, ウマ娘 ウマ娘のガチャを天井まで回すのが得意です Twitter: yt8492 yt8492.com
  2. Compose Multiplatformとは - Jetpack Composeをベースとした、高速かつリアクティブな、デスクトップとWebの UIフレームワーク - KotlinでDesktopとWebの開発ができるよ!やったね! - Compose

    for DesktopとCompose for Webで構成されている - Compose for Desktop - JVMで動く - レンダリングにSkiaを使用 - AndroidとUIコンポーネントの共有が可能 - Compose for Web - JSにトランスパイルする - DOMベース - わりとReactに近い - 1.0.0 Release🎉
  3. 実際どこまでできるのか - Compose for Desktop - 標準で用意されている UIコンポーネントに関しては Androidと同じものが使える -

    Scaffold, Column, Text, Button, etc… - マウスイベントの取得など Desktop向けのAPIが用意されている - Swingと相互運用可能 - ルーティングまわりなどを外部ライブラリに頼れば UI層のコードをかなり共通化できる - Decomposeなど - Windows, Linux, MacOSに対応 - Jetbrainsは既にJetBrains Toolbox Appでプロダクション導入している
  4. 実際どこまでできるのか - Compose for Web - ReactのようにHTMLのタグに対応したUIコンポーネントが用意されている - スタイルはAndroidやDesktopとは違いCSSのDSLを書くかCSSを書いてclassを指定する -

    素のReactを触っている感覚に近い - 周辺ライブラリが全然ないのが厳しい - DesktopやAndroidとのUIコンポーネントの共有は今の所できなさそう - ちょっと前はできたんだけど Deprecatedになってた😢 - Jimさんが将来的にサポートするとは Twitterで言っていた - まだプロダクション導入するには早そう - そもそも選択肢にあるのか
  5. やってみた感想 - Desktopはやってて特に違和感は感じなかった - AndroidのJetpack Compose経験がある人なら今すぐにでも始められそう - UI共通化は画面全部を共通化するよりも部品単位で共通化するのがいいかも - DesktopやAndroidに合わせたUIを組む

    - Webはちょっと辛そう - 書き味がだいぶReact寄りなのでJetpack Composeの感覚からちょっと遠くなる - 周辺ライブラリの不足 - 現状まだkotlin-reactに軍配があがりそう - ルーティングにDecompose以外の選択肢が出てきた - 今回はWebの実装にHashRouterとBrowserRouterを提供するライブラリを使った - https://github.com/hfhbd/routing-compose - Decomposeはルーティングを提供する関数が Web未対応(そもそも今後対応するのか? )