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

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

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for おかやまん おかやまん
September 09, 2021
Programming
450
0

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

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

Avatar for おかやまん

おかやまん

September 09, 2021

More Decks by おかやまん

See All by おかやまん
具体と抽象の行き来を意識する
Avatar for おかやまん blendthink
0
500
FlutterKaigi Day1「Dart のこれから」
Avatar for おかやまん blendthink
1
6.9k
公開している Notion サイトから人名を抽出して、誤って個人情報を記載していないか検出できるようにしてみた
Avatar for おかやまん blendthink
0
540
Yumemi.apk #6 ～ゆめみのAndroidエンジニア 日頃の成果大発表会！～ Session 2
Avatar for おかやまん blendthink
1
730
株式会社ゆめみの Android の採用コーディング試験を公開しました
Avatar for おかやまん blendthink
0
180
Developers Boost Session 6
Avatar for おかやまん blendthink
1
990

Other Decks in Programming

See All in Programming
Claude Code × Gemini × Ebitengine ゲーム制作素人WebエンジニアがGoでゲームを作った話
Avatar for webzawa webzawa
0
130
PHP で mp3 プレイヤーを実装しよう
Avatar for memory m3m0r7
PRO
0
270
SkillがSkillを生む：QA観点出しを自動化した
Avatar for sontixyou sontixyou
6
3.4k
SREに優しいTerraform構成 modulesとstateの組み方
Avatar for hiyanger hiyanger
2
120
JAWS-UG横浜 #100 祝・第100回スペシャル AWS は VPC レスの時代へ
Avatar for maroon1st maroon1st
0
130
AI-DLC Deep Dive
Avatar for yuukiyo yuukiyo
8
3.8k
2026-03-27 #terminalnight 変数展開とコマンド展開でターミナル作業をスマートにする方法
Avatar for SUZUKI Masashi masasuzu
0
330
LM Linkで(非力な！)ノートPCでローカルLLM
Avatar for 瀬尾佳隆 seosoft
0
490
Google Nest CamとApple Vision frameworkと猫🐈🐈‍⬛ / onishi50
Avatar for Yutaro Muta yutailang0119
0
110
Xdebug と IDE による デバッグ実行の仕組みを見る / Exploring-How-Debugging-Works-with-Xdebug-and-an-IDE
Avatar for shin1x1 shin1x1
0
380
瑠璃の宝石に学ぶ技術の声の聴き方 / 【劇場版】アニメから得た学びを発表会2026 #エンジニアニメ
Avatar for mazrean mazrean
0
250
感情を設計する
Avatar for nakamichi ichimichi
5
1.5k

Featured

See All Featured
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
150
Navigating Algorithm Shifts & AI Overviews - #SMXNext
Avatar for Aleyda Solis aleyda
1
1.2k
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
Avatar for Christian Goodrich cargoodrich
3
680
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.6k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.1k
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
110
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
800
WENDY [Excerpt]
Avatar for Tessa Abrams tessaabrams
10
37k
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
98
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
200
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
220
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.3k

Transcript

  1. Jetpack Compose for Web で ちょっとしたサイトつくってみた 2021.09.10 Yumemi.apk #5 ～Kotlin夏祭り～

  2. おかやまん • Android App Developer • 株式会社ゆめみ（2019年11月入社） • 猫ちゃんを飼いはじめました •

    副業やってます blendthink
  3. None

  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

  15. None
  16. None

  17. 実際に、ポートフォリオ作ってみました

  18. 実際のコードへ

  19. ご静聴ありがとうございました