Slide 1

Slide 1 text

KMMで始めるマルチプラット フォーム開発 サイボウズ株式会社 Androidエンジニア 藤⽥ 真輔

Slide 2

Slide 2 text

2 • 藤⽥ 真輔(ふじた しんすけ) • 2022年4⽉サイボウズ⼊社 サイボウズ歴2年⽬ • モバイルエンジニア(Android)、昔はVB/C/Javaとかも経験あり • 担当プロダクトはkintone • 趣味はサッカー、ONE PIECEなど ⾃⼰紹介

Slide 3

Slide 3 text

3 • 最近のカジュアル⾯談で「KMMをプロダクトに導⼊してます」 「サイボウズのモバイルではクロスプラットフォームを導⼊し ないのですか?」という話になることが何回かありました はじめに • LTの時間の都合上、今回調べたことを全ては詰め込めませんで した。そのうちまとめ記事でも書こうと思います! • ⾃分はKMMに対して「OS共通のロジックが書ける」程度のイ メージで具体的な事は知らなかったので、いい機会だと思い調 べてみることにしました

Slide 4

Slide 4 text

4 • KMMとは? • KMMの仕組み紹介 • KMMプロジェクトの作成⽅法 • 実践編(Androidのみ) • まとめ 今⽇お話しすること

Slide 5

Slide 5 text

5 • KMP = Kotlin Multiplatformの略 KMMとは? • Kotlinを利⽤して複数プラットフォームに対応したアプリケー ションを開発する技術やそのエコシステム全体を指します。 Web、モバイル、デスクトップの各プラットフォーム間でアプ リケーションロジックを共有しながら、ユーザーにとってネイ ティブなエクスペリエンスを維持することができます。

Slide 6

Slide 6 text

6 • KMM = Kotlin Multiplatform Mobileの略 KMMとは? • Kotlin Multiplatform Mobileは、 iOSおよびAndroidアプリ開発の ためのSDKです。クロスプラットフォームとネイティブアプリを 作成する際の利点をすべて兼ね備えています。 • 前述したKotlin Multiplatformに加えて、いくつかのモバイルア プリケーション開発に特化した技術を総称して、 Kotlin Multiplatform Mobileと呼んでいます。 • 実はまだbetaで、2023年末までにstableに昇格予定 「KMM = Kotlin Multiplatform + Mobile Features」

Slide 7

Slide 7 text

7 • 公式ではプラットフォーム間で共有できたのはコードのどの部 分か?のアンケート結果も出ている KMMとは?

Slide 8

Slide 8 text

8 Kotlin Multiplatformの仕組み • commonKotlinには、⾔語、コアライブラリ、基本ツールが含まれて います。共通のKotlinで書かれたコードは、すべてのプラットフォー ムでどこでも動作します

Slide 9

Slide 9 text

9 Kotlin Multiplatformの仕組み • Kotlinのマルチプラットフォームライブラリを使⽤すると、マルチプラッ トフォームロジックを共通コードとプラットフォーム固有のコードで再利 ⽤することができます。共通コードは、HTTP、serialization、coroutines の管理などの⽇常的なタスクをカバーする⼀連のライブラリに依存するこ とができます。 • プラットフォームと相互運⽤するためには、プラットフォームに特化した バージョンのKotlinを使⽤します。Kotlinのプラットフォーム固有バージョ ン(Kotlin/JVM、Kotlin/JS、Kotlin/Native)には、Kotlin⾔語の拡張、プ ラットフォーム固有のライブラリやツールが含まれています。 • これらのプラットフォームを通じて、プラットフォームのネイティブコー ド(JVM、JS、Native)にアクセスし、すべてのネイティブ機能を活⽤する ことができます。

Slide 10

Slide 10 text

10 • プロジェクトで使⽤するすべてのプラットフォーム間でコードを共有します。 すべてのプラットフォームに適⽤される共通のビジネスロジックを共有する ために使⽤します。 Kotlin Multiplatformの仕組み • Kotlin Multiplatformを使えば、異なるプラットフォームで同じコードを書いたり、 メンテナンスしたりする⼿間を省くことができます

Slide 11

Slide 11 text

11 • 共有コードからプラットフォーム固有のAPIにアクセスする必要がある場合は、 Kotlinの仕組みであるexpectとactualを使⽤します Kotlin Multiplatformの仕組み • プロジェクトに含まれるいくつかのプラットフォーム間でコードを共有するが、す べてのプラットフォームでは共有しない。これは、類似のプラットフォームでコー ドの多くを再利⽤できる場合に⾏います

Slide 12

Slide 12 text

12 Kotlin Multiplatformの仕組み • sharedモジュールのcommonMainではプラットフォーム固有の APIにアクセスできない。アクセスするにはexpect/actualを活 ⽤する(例としてUUID⽣成などが挙げられている)

Slide 13

Slide 13 text

13 Kotlin Multiplatformの仕組み • expect/actualの活⽤例 iosMain/Platform.kt androidMain/Platform.kt commonMain/Platform.kt

Slide 14

Slide 14 text

14 Kotlin Multiplatformの仕組み • expect/actualの活⽤例 commonMain/Greeting.kt 実⾏結果

Slide 15

Slide 15 text

15 • 導⼊準備 Android Studio/Xcode、JDK、KotlinMultiplatform Mobile pluginなどをインストール KMMプロジェクトの作成⽅法 1. Android StudioにてNew Project => Kotlin Multiplatform App を選択 2. アプリ名やパッケージ名を⼊⼒、初期モジュールの名前を決め る、iOS framework distributionを選択してFinish!

Slide 16

Slide 16 text

• 作成直後のプロジェクト構成は以下の通り KMMプロジェクトの作成⽅法 • androidApp・・・AndroidアプリケーションにビルドするKotlinモ ジュール。通常のAndroidライブラリとしてsharedモジュールに依 存する。 • iosApp・・・iOSアプリケーションにビルドするXcodeプロジェク ト。iOS frameworkとしてsharedモジュールに依存する。 • shared・・・両OSに共通するロジック、共有すべきコードを含む Kotlinモジュール。3つのsource setで構成されている • commonMain・・・プラットフォーム共通のソースセット • androidMain/iosMain・・・それぞれのOS向けのソースセット 16

Slide 17

Slide 17 text

17 • 実⾏時の流れとしては⼤体以下の感じ KMMプロジェクトの作成⽅法 1. sharedモジュールや他モジュールが各OS⽤のネイティブライ ブラリとしてビルドされる 2. androidApp or iosAppがsharedのビルド結果であるライブラリ を参照して、普通のAndroid/iOSアプリとしてビルドされる

Slide 18

Slide 18 text

18 • 個⼈で作っていたQiitaAPIを⽤いて記事⼀覧を取得する仕組みを KMMプロジェクトで作ってみました(Androidのみ) 実践編 Multiplatform dependencies Navtive dependencies 通信 Ktor、Ktrofitなど Retrofit DI Koin、Koject、kotlin-injectなど Hilt、Dagger ViewModel moko-mvvmなど Android lifecycle ViewModel • なお、commonMainではマルチモジュールライブラリしか利⽤ できないのでHiltやRetrofitというAndroid開発では⼀般的なライ ブラリが使えない

Slide 19

Slide 19 text

19 • モジュール構成 実践編 app feature domain Androidプロジェクト KMMプロジェクト data androidApp iosApp feature shared domain data ※sharedモジュール内でそ れ以降のレイヤーのクラスを 持つリポジトリも散⾒されて るので、何がいいのかはまだ 確⽴されてない?

Slide 20

Slide 20 text

20 • モジュール構成 実践編 l androidApp l Application、MainActivity l data l repository、datasource、api、response l domain l usecase l feature l Android UI(JetpackCompose) l iosApp l SwiftUI l shared l KoinModule

Slide 21

Slide 21 text

21 • 実⾏結果 実践編 l androidApp l iosApp framework not found Pods_iosApp・・・ linker command failed with exit code 1・・・ no such module ʻsharedʼ・・・ Execution failed for task ':shared:embedAndSignAppleFrameworkForXcode'. > Please run the embedAndSignAppleFrameworkForXcode task from Xcode ('SDK_NAME', 'CONFIGURATION', 'TARGET_BUILD_DIR', 'ARCHS' and 'FRAMEWORKS_FOLDER_PATH' not provided) モウユルシテ・・・

Slide 22

Slide 22 text

22 • KMM導⼊によるメリットもあるが、デメリット(Java資産が使えない、iOSのデ バッグがしづらい)も結構あるので導⼊には設計をしっかりして⽤法⽤量を守るべ し まとめ • やってみて意外?とiOSの知識が求められるケースがあるので、Androidエンジニ ア単独で⾊々やろうと⼤変になりがちな気がする • ライブラリも共有コードではAndroid開発で使えたものが使えないなど制約がある ので、事前の設計などでしっかりと詳細を決めた⽅がよさそう • KMMはまだBetaなので、ググってみてもKMMプロジェクトの形は⾊々模索され てる • 逆に⾔えば探求するチャンスとも⾔えそう

Slide 23

Slide 23 text

23 ご 清 聴 あ り が と う ご ざ い ま し た ! ! ! まとめ

Slide 24

Slide 24 text

24 Kotlin Mulitplatform https://kotlinlang.org/docs/multiplatform.html How Kotlin Multiplatform works https://kotlinlang.org/docs/multiplatform.html#how-kotlin-multiplatform-works Install the necessary tools https://kotlinlang.org/docs/multiplatform-mobile-setup.html#install-the-necessary-tools Connect to platform-specific APIs https://kotlinlang.org/docs/multiplatform-connect-to-apis.html Get started with Kotlin Multiplatform for mobile https://kotlinlang.org/docs/multiplatform-mobile-getting-started.html#0 参考リンク