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

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

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
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
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
170
Developers Boost Session 6
Avatar for おかやまん blendthink
1
980

Other Decks in Programming

See All in Programming
Agentic AI: Evolution oder Revolution
Avatar for Lars Roewekamp mobilelarson
PRO
0
180
20260228_JAWS_Beginner_Kansai
Avatar for Takuya Yonezawa takuyay0ne
5
530
Claude Codeログ基盤の構築
Avatar for giginet giginet
PRO
7
3.3k
Codex の「自走力」を高める
Avatar for yorifuji yorifuji
0
1.2k
「やめとこ」がなくなった — 1月にZennを始めて22本書いた AI共創開発のリアル
Avatar for atani atani14
0
390
new(1.26) ← これすき / kamakura.go #8
Avatar for utagawa kiki utgwkk
0
2.3k
The Ralph Wiggum Loop: First Principles of Autonomous Development
Avatar for Ryuichiro Semba sembayui
0
3.7k
AI Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
Claude Codeセッション現状確認 2026福岡 / fukuoka-aicoding-00-beacon
Avatar for monochromegane monochromegane
4
420
ふつうのRubyist、ちいさなデバイス、大きな一年 / Ordinary Rubyists, Tiny Devices, Big Year
Avatar for chobishiba chobishiba
1
460
CSC307 Lecture 14
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
470
どんと来い、データベース信頼性エンジニアリング / Introduction to DBRE
Avatar for nnaka2992 nnaka2992
1
290

Featured

See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.4k
Abbi's Birthday
Avatar for Violet Bock coloredviolet
2
5.4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
508
140k
Docker and Python
Avatar for Tania Allard trallard
47
3.8k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
410
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
0
160
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
220
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.2k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8k
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
110

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