KMPとApolloを利用したマルチプラットフォーム開発

Transcript

1. KMPとApolloを利用した マルチプラットフォーム開発 　　2024年5月11日Zli大LT HAMADA
2. 自己紹介 名前　濵田翔真　 学年　会津大学 4回生 (22歳) -> 院進予定 出身　京都 ハンドルネーム　HAMADA 趣味　龍角散 ソフトテニス 阪神タイガース 音楽(合唱,カ ラオケ,ウクレレ, オカリナ等々） 技術　Android バックエンド etc 情報発信 Twitter　AHMOS_HMD はてなブログ hahahamada.hatenablog.com 特技　人の名前を覚えること
3. agenda KMPについて 経緯 アプリのMVP Apolloについて UI実装
4. 経緯
5. 経緯 最終的に、WEB, iOS, Androidでアプリケーションを作成 KMPとGraphQLについて学びたかった 所属しているサークルのギャラリーアプリを作ることに 以上のような理由から、今回の仕様でアプリ開発をすることに
7. アプリのMVP 制作作品の画像とその他情報が記載されたページの作成 ページをリスト表示する 画像表示 作品の情報を表示する 登録画面(サークルメンバーのみが使える)の作成
8. 使用技術
9. 使用技術 Kotlin Jetpack Compose Kotlin MultiPlatform Apollo GraphQL Coil Go graphql-go DynamoDB Swift SwiftUI
10. さまざまなプラットフォーム向けのアプリケーションを作成し、 ネイティブプログラミングのメリットを維持しながらプラットフ ォーム間でコードを再利用可能することのできる技術 Kotlin Mutiplatform iOS、Android、デスクトップ、ウェブなどのプラットフォー ムに対応しています
11. KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android TegeiGallery-iOS 大きく三つのディレクトリがある
12. KMPのプロジェクト 今回作成したプロジェクト以下には Shared ← iOSとAndroidで共有するコード TegeiGallery-Android TegeiGallery-iOS 大きく三つのディレクトリがある
13. KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android ← Androidで利用するコード UI TegeiGallery-iOS 大きく三つのディレクトリがある
14. KMPのプロジェクト 今回作成したプロジェクト以下には Shared TegeiGallery-Android TegeiGallery-iOS　← iOSで利用するコード UI 大きく三つのディレクトリがある
15. Apollo Android GraphQLクエリからKotlin、Javaのモデルを生成するGraphQL クライアント
16. を追加する Apolloを使う sharedのbuild.gradle.ktsに以下を追加 pluginsに, soucesets commonMain.dependenciesに,
17. shared/commonMain/graphql に schema.graphqlsをおく Apolloを使う
18. schemaの定義をもとにqueryを作成 buildすると shared/build/generated/source/apollo/ commonMain/service/AllItemQuery が生成されます Apolloを使う
19. Repositoryでこんな感じで定義する Flowで実装しているので、Swift側では ObservableObjectにする必要がある Apolloを使う
20. UI実装
21. 昨日、モックのUIが渡されました
22. AndroidのUIを実装してみた
23. iOSは...？
24. iOS経験が無さすぎて 間に合いませんでした....
25. 共通化する部分と共通化しない部分の解釈が難しかった ObservableObjectへの変更が,できていないのでそこの部分 を実装する。 XCodeと少し仲良くなれた GraphQLへの理解が深まった KMPと言いつつ、commonMainが抽象化されていないので 改善する 展望と感想
26. HAMADAの 次回作にご期待ください
27. ご清聴ありがとう ありがとうございました
28. 今回のリポジトリ