Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
KMPとApolloを利用したマルチプラットフォーム開発
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
HAMADA
May 29, 2024
0
110
KMPとApolloを利用したマルチプラットフォーム開発
HAMADA
May 29, 2024
Tweet
Share
More Decks by HAMADA
See All by HAMADA
Unity as a Library で 3Dモデルを表示してみた話
hamashle
0
43
AndroidのWidget作ってみた
hamashle
0
31
Hiltのありがたさを知る
hamashle
0
18
Featured
See All Featured
Java REST API Framework Comparison - PWX 2021
mraible
34
9.1k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
190
Darren the Foodie - Storyboard
khoart
PRO
2
2.4k
Music & Morning Musume
bryan
47
7.1k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
120
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
80
The Spectacular Lies of Maps
axbom
PRO
1
530
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
The agentic SEO stack - context over prompts
schlessera
0
650
Optimising Largest Contentful Paint
csswizardry
37
3.6k
BBQ
matthewcrist
89
10k
Transcript
KMPとApolloを利用した マルチプラットフォーム開発 2024年5月11日Zli大LT HAMADA
自己紹介 名前 濵田翔真 学年 会津大学 4回生 (22歳) -> 院進予定 出身 京都 ハンドルネーム HAMADA 趣味 龍角散
ソフトテニス 阪神タイガース 音楽(合唱,カ ラオケ,ウクレレ, オカリナ等々) 技術 Android バックエンド etc 情報発信 Twitter AHMOS_HMD はてなブログ hahahamada.hatenablog.com 特技 人の名前を覚えること
agenda KMPについて 経緯 アプリのMVP Apolloについて UI実装
経緯
経緯 最終的に、WEB, iOS, Androidでアプリケーションを作成 KMPとGraphQLについて学びたかった 所属しているサークルのギャラリーアプリを作ることに 以上のような理由から、今回の仕様でアプリ開発をすることに
None
アプリのMVP 制作作品の画像とその他情報が記載されたページの作成 ページをリスト表示する 画像表示 作品の情報を表示する 登録画面(サークルメンバーのみが使える)の作成
使用技術
使用技術 Kotlin Jetpack Compose Kotlin MultiPlatform Apollo GraphQL Coil Go
graphql-go DynamoDB Swift SwiftUI
さまざまなプラットフォーム向けのアプリケーションを作成し、 ネイティブプログラミングのメリットを維持しながらプラットフ ォーム間でコードを再利用可能することのできる技術 Kotlin Mutiplatform iOS、Android、デスクトップ、ウェブなどのプラットフォー ムに対応しています
KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android TegeiGallery-iOS 大きく三つのディレクトリがある
KMPのプロジェクト 今回作成したプロジェクト以下には Shared ← iOSとAndroidで共有するコード TegeiGallery-Android TegeiGallery-iOS 大きく三つのディレクトリがある
KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android ← Androidで利用するコード UI TegeiGallery-iOS 大きく三つのディレクトリがある
KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android TegeiGallery-iOS ← iOSで利用するコード UI 大きく三つのディレクトリがある
Apollo Android GraphQLクエリからKotlin、Javaのモデルを生成するGraphQL クライアント
を追加する Apolloを使う sharedのbuild.gradle.ktsに以下を追加 pluginsに, soucesets commonMain.dependenciesに,
shared/commonMain/graphql に schema.graphqlsをおく Apolloを使う
schemaの定義をもとにqueryを作成 buildすると shared/build/generated/source/apollo/ commonMain/service/AllItemQuery が生成されます Apolloを使う
Repositoryでこんな感じで定義する Flowで実装しているので、Swift側では ObservableObjectにする必要がある Apolloを使う
UI実装
昨日、モックのUIが渡されました
AndroidのUIを実装してみた
iOSは...?
iOS経験が無さすぎて 間に合いませんでした....
共通化する部分と共通化しない部分の解釈が難しかった ObservableObjectへの変更が,できていないのでそこの部分 を実装する。 XCodeと少し仲良くなれた GraphQLへの理解が深まった KMPと言いつつ、commonMainが抽象化されていないので 改善する 展望と感想
HAMADAの 次回作にご期待ください
ご清聴ありがとう ありがとうございました
今回のリポジトリ