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

「 動く」サンプルでスムーズなコミュニケーションを

Avatar for Kazuki Chigita Kazuki Chigita
October 31, 2025
3

「 動く」サンプルでスムーズなコミュニケーションを

2025/11/01 16:50-17:10 @ let?(402N) Kotlin Fest 2025 での登壇資料です
https://2025.kotlinfest.dev/timetable/1719039000_c/

KotlinPlaygroundはブラウザ上で編集・実行・共有が完結する、JetBrainsによって提供されているウェブサイトです。
Kotlinのバージョンや実行環境を簡単に変更して、ウェブ上で実行結果まで確認できるため、手軽に動作を確認できるサンプルコードを共有するツールとして活用されています。
直近では、Compose MultiplatformやCanvas等の様々な実行環境のサポートが行われており、動くUIのサンプルを書いて共有することもできるようになっています。このセッションでは機能紹介からはじめ、ショートカットや、できることの限界といった点まで触れて効果的なコード共有を実現するためのベストプラクティスを含む内容を紹介します。

「動く」コードサンプルでチームのコミュニケーションをよりスムーズにしてみませんか?

Avatar for Kazuki Chigita

Kazuki Chigita

October 31, 2025
Tweet

Transcript

  1. 自己紹介 誰? : Kazuki CHIGITA / @chigichan24 株式会社MIXI で「家族アルバム みてね」

    の 開発中 好きなKotlinの言語仕様 : sealed interface 好きなModifier : draggable2D 2
  2. バージョン差に関する挙動あれこれの調査が可能 - 一番古いもので1.2.71、最も新しいものが2.3.0-beta2がある - メリット - バージョン別の挙動を確かめることにも役立つ - 簡単に最新機能に触れられる -

    本腰を入れた調査はここだけでは難しい - 例えば、一部言語機能はx.x.0 から x.x.20 になるときに挙動が変 わることもある (e.g. readLine挙動変更騒動) - その類のものはここだけでは確かめられない 14
  3. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) 20
  4. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) transpileした結果を吐き出してくれる 21
  5. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) 後述 24
  6. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) テストの実行ができる (!?) 25
  7. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) テストの実行ができる (!?) https://pl.kotl.in/WqWpZ0j97 org.junitがインポートできるのがメリット 27
  8. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) テストの実行ができる (!?) https://pl.kotl.in/WqWpZ0j97 org.junitがインポートできるのがメリット 有名どころのmockライブラリは使えない :sad: 28
  9. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) 40
  10. 選択可能なプラットフォーム - JVM - JS - Compose Multiplatform - Wasm

    - JUnit - Canvas - Swift export (以前は選択できたが、ここ数ヶ月?でなくなった) 今日の話題の中心 41
  11. Compose Multiplatform - iOS、Desktop、Webなどあらゆるプラットフォームで 動作させることができるオープンソースの宣言型フレームワーク - for Webは現在ベータ - Kotlin

    Playgroundで実行できる理由はこの技術 - Kotlin/Wasmの技術によって実現される https://kotlinlang.org/docs/wasm-get-started.html 細やかな話は他のセッションにおまかせ 43
  12. import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.ExperimentalComposeUiApi import androidx.compose.ui.window.ComposeViewport import kotlinx.browser.document

    @OptIn(ExperimentalComposeUiApi::class) fun main() { ComposeViewport(document.body!!) { App() } } @Composable fun App() { Text("Hello") } https://pl.kotl.in/_QXI_TqsU 48
  13. import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.ExperimentalComposeUiApi import androidx.compose.ui.window.ComposeViewport import kotlinx.browser.document

    @OptIn(ExperimentalComposeUiApi::class) fun main() { ComposeViewport(document.body!!) { App() } } @Composable fun App() { Text("Hello") } https://pl.kotl.in/_QXI_TqsU Compose for Web のAPI HTMLのDOM要素に、Compose UIを統合してくれる 49
  14. import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.ExperimentalComposeUiApi import androidx.compose.ui.window.ComposeViewport import kotlinx.browser.document

    @OptIn(ExperimentalComposeUiApi::class) fun main() { ComposeViewport(document.body!!) { App() } } @Composable fun App() { Text("Hello") } https://pl.kotl.in/_QXI_TqsU Compose for Web のAPI HTMLのDOM要素に、Compose UIを統合してくれる 注意: 以前まではCanvasBasedWindowで書くのが 主流だったので、書き方が変わっている 50
  15. import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.ExperimentalComposeUiApi import androidx.compose.ui.window.ComposeViewport import kotlinx.browser.document

    @OptIn(ExperimentalComposeUiApi::class) fun main() { ComposeViewport(document.body!!) { App() } } @Composable fun App() { Text("Hello") } https://pl.kotl.in/_QXI_TqsU 本質 51