Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

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

Avatar for おかやまん おかやまん
September 09, 2021
Programming
0
440

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

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

Avatar for おかやまん

おかやまん

September 09, 2021
Tweet

More Decks by おかやまん

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

Other Decks in Programming

See All in Programming
競馬で学ぶ機械学習の基本と実践 / Machine Learning with Horse Racing
Avatar for ShoheiMitani shoheimitani
14
14k
宅宅自以為的浪漫：跟 AI 一起為自己辦的研討會寫一個售票系統
Avatar for 高見龍 eddie
0
350
社内オペレーション改善のためのTypeScript / TSKaigi Hokuriku 2025
Avatar for dachi023 dachi023
1
140
レイトレZ世代に捧ぐ、今からレイトレを始めるための小径
Avatar for ichi-raven ichi_raven
0
480
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
Avatar for Chris Richardson cer
PRO
0
160
jakarta-security-jjug-ccc-2025-fall
Avatar for tnagao7 tnagao7
0
100
CSC305 Lecture 15
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
220
sbt 2
Avatar for kenji yoshida xuwei_k
0
120
dnx で実行できるコマンド、作ってみました
Avatar for Tomohisa Takaoka tomohisa
0
120
251126 TestState APIってなんだっけ?Step Functionsテストどう変わる?
Avatar for Takumi Abe east_takumi
0
290
Google Antigravity and Vibe Coding: Agentic Development Guide
Avatar for MIKIO KUBO mickey_kubo
2
110
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
0
26k

Featured

See All Featured
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
11
950
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.8k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.3k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.6k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
333
24k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
76
5.2k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
95
14k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
34
2.5k

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. ご静聴ありがとうございました