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

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

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

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
450
FlutterKaigi Day1「Dart のこれから」
Avatar for おかやまん blendthink
1
6.5k
公開している Notion サイトから人名を抽出して、誤って個人情報を記載していないか検出できるようにしてみた
Avatar for おかやまん blendthink
0
510
Yumemi.apk #6 ～ゆめみのAndroidエンジニア 日頃の成果大発表会！～ Session 2
Avatar for おかやまん blendthink
1
680
株式会社ゆめみの Android の採用コーディング試験を公開しました
Avatar for おかやまん blendthink
0
130
Developers Boost Session 6
Avatar for おかやまん blendthink
1
930

Other Decks in Programming

See All in Programming
モバイルアプリからWebへの横展開を加速した話_Claude_Code_実践術.pdf
Avatar for Kazuya Sakamoto kazuyasakamoto
0
280
SOCI Index Manifest v2が出たので調べてみた / Introduction to SOCI Index Manifest v2
Avatar for Tetsuya Kikuchi tkikuc
1
110
RDoc meets YARD
Avatar for Masafumi Okura okuramasafumi
3
140
あのころの iPod を どうにか再生させたい
Avatar for orumin orumin
2
2.5k
ワープロって実は計算機で
Avatar for Chiharu Shirasaka pepepper
2
1.4k
レガシープロジェクトで最大限AIの恩恵を受けられるようClaude Codeを利用する
Avatar for tk1351 tk1351
3
1.3k
AI時代のドメイン駆動設計-DDD実践におけるAI活用のあり方 / ddd-in-ai-era
Avatar for MinoDriven minodriven
23
9k
Scale out your Claude Code ~⁨⁩自社専用Agentで10xする開発プロセス~
Avatar for Yuku Kotani yukukotani
9
2.6k
Kiroの仕様駆動開発から見えてきたAIコーディングとの正しい付き合い方
Avatar for clshinji clshinji
1
150
AWS Serverless Application Model入門_20250708
Avatar for ShinMatsuzaki smatsuzaki
0
140
250830 IaCの選定~AWS SAMのLambdaをECSに乗り換えたときの備忘録~
Avatar for Takumi Abe east_takumi
0
250
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
Avatar for Wataru Takahara mipypf
0
870

Featured

See All Featured
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
64
7.9k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
525
40k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
656
61k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
161
15k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.6k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
302
21k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
512
110k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
301
51k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
507
140k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
431
65k

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