Yumemi.apk #5 ～Kotlin夏祭り～ Session 2

https://yumemi.connpass.com/event/219861/

Transcript

1. Jetpack Compose for Web で ちょっとしたサイトつくってみた 2021.09.10 Yumemi.apk #5 ～Kotlin夏祭り～
2. おかやまん • Android App Developer • 株式会社ゆめみ（2019年11月入社） • 猫ちゃんを飼いはじめました • 副業やってます blendthink
4. Jetpack Compose for Web ってなぁに？ • Jetpack Compose を基盤にしているリアクティブ Web UI • Web アプリの UI 開発を簡素化・高速化 • 将来的に、Web・デスクトップ・Android アプリの間で UI コードの共通化を狙って いる • タイプセーフに HTML や CSS が書ける • まだアルファ版
5. https://compose-web.ui.pages.jetbrains.team
6. チュートリアルやってみる 先ほどの Web サイトの下部にチュートリアルのリン クがあります。 ツールのバージョン要件とかあるのでお気をつけく ださい。 • JDK 11 以上 • IntelliJ IDEA Community Edition or Ultimate Edition 2020.2 以上
7. 1. プロジェクト作成
8. 2. settings.gradle.kts を更新
9. 3. build.gradle.kts を更新
10. 3. build.gradle.kts を更新
11. 4. 必要なフォルダを追加 • src/jsMain/kotlin • src/jsMain/resources
12. 5. resources に index.html を追加
13. 6. Main.kt を追加
14. 7. プロジェクトを実行！ ./gradlew jsBrowserRun
17. 実際に、ポートフォリオ作ってみました
18. 実際のコードへ
19. ご静聴ありがとうございました