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
450

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

Other Decks in Programming

See All in Programming
Railsの気持ちを考えながらコントローラとビューを整頓する/tidying-rails-controllers-and-views-as-rails-think
Avatar for MOROHASHI Kyosuke moro
4
340
あなたはユーザーではない #PdENight
Avatar for Takuma Kajikawa kajitack
4
270
要求定義・仕様記述・設計・検証の手引き - 理論から学ぶ明確で統一された成果物定義
Avatar for Kuniwak orgachem
PRO
1
390
Rails Girls Tokyo 18th GMO Pepabo Sponsor Talk
Avatar for Yuto Kondo yutokyokutyo
0
170
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
Avatar for Masahiro Nishimi masahiro_nishimi
7
1.2k
CSC307 Lecture 08
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
690
24時間止められないシステムを守る-医療ITにおけるランサムウェア対策の実際
Avatar for kouki.miura koukimiura
2
170
Geminiの機能を調べ尽くしてみた
Avatar for yosshi naruyoshimi
0
170
受け入れテスト駆動開発(ATDD)×AI駆動開発 AI時代のATDDの取り組み方を考える
Avatar for Takasaki Kazunari kztakasaki
2
430
個人開発は儲からない - それでも開発開始1ヶ月で300万円売り上げた方法
Avatar for Taishi Yamasaki taishiyade
0
110
朝日新聞のデジタル版を支えるGoバックエンド ー価値ある情報をいち早く確実にお届けするために
Avatar for JunkiIshida junkiishida
1
250
Agent Skills Workshop - AIへの頼み方を仕組み化する
Avatar for Gota gotalab555
12
6.6k

Featured

See All Featured
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
140
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
470
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
80
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
3
320
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
200
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
Mozcon NYC 2025: Stop Losing SEO Traffic
Avatar for Sam Torres samtorres
0
160
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5k
New Earth Scene 8
Avatar for Sydney Stone popppiees
1
1.6k
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
450
Between Models and Reality
Avatar for mayunak mayunak
1
210
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
370

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