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

ウォンテッドリーでのKMPワークフロー / KMP workflow at Wantedly

Avatar for Masatoshi Kubode Masatoshi Kubode
May 21, 2024
Programming
0
1.8k

ウォンテッドリーでのKMPワークフロー / KMP workflow at Wantedly

https://wantedly.connpass.com/event/316051/
Avatar for Masatoshi Kubode

Masatoshi Kubode

May 21, 2024
Tweet

More Decks by Masatoshi Kubode

See All by Masatoshi Kubode
ウォンテッドリーの「ココロオドル」モバイル開発 / Wantedly's "kokoro odoru" mobile development
Avatar for Masatoshi Kubode kubode
2
950
Firebase Dynamic Linksの代替手段を自作する / Create your own Firebase Dynamic Links alternative
Avatar for Masatoshi Kubode kubode
0
380
技術を根付かせる / How to make technology take root
Avatar for Masatoshi Kubode kubode
1
350
WantedlyでのKotlin Multiplatformの導入と課題 / Kotlin Multiplatform Implementation and Challenges at Wantedly
Avatar for Masatoshi Kubode kubode
0
440
Google Play Consoleデベロッパー アカウントの確認 / Verifying your Play Console developer account
Avatar for Masatoshi Kubode kubode
1
1.2k
Make your Android app into Multiplatform app
Avatar for Masatoshi Kubode kubode
0
150
ウォンテッドリーにおけるモバイルアプリ開発 / iOSDC Japan 2024 Sponsor Session
Avatar for Masatoshi Kubode kubode
1
1.1k
Jetpack ComposeのBottomSheetとの戦い / Fight with BottomSheet of Jetpack Compose
Avatar for Masatoshi Kubode kubode
0
790
Mobile Chapterが目指すところと技術 / Vision and Technology of Mobile Chapter at Wantedly
Avatar for Masatoshi Kubode kubode
0
360

Other Decks in Programming

See All in Programming
なぜ「共通化」を考え、失敗を繰り返すのか
Avatar for Rinchoku rinchoku
1
630
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
Avatar for コドモン開発チーム codmoninc
1
4.3k
Flutterで備える！Accessibility Nutrition Labels完全ガイド
Avatar for 野瀬田　裕樹 yuukiw00w
0
140
Systèmes distribués, pour le meilleur et pour le pire - BreizhCamp 2025 - Conférence
Avatar for Sébastien LECACHEUR slecache
0
120
PipeCDのプラグイン化で目指すところ
Avatar for Warashi warashi
1
250
Porting a visionOS App to Android XR
Avatar for Akio Itaya akkeylab
0
200
RailsGirls IZUMO スポンサーLT
Avatar for 16bit_idol 16bitidol
0
140
Rubyでやりたい駆動開発 / Ruby driven development
Avatar for chobishiba chobishiba
1
560
エンジニア向け採用ピッチ資料
Avatar for 犬飼嵩 inusan
0
180
都市をデータで見るってこういうこと　PLATEAU属性情報入門
Avatar for nokonoko1203 nokonoko1203
1
590
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
Avatar for Kentaro Yoshida y_ken
0
340
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
Avatar for Mana Takada mana_takada
0
140

Featured

See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
48
5.4k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.3k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
46
9.6k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
181
53k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
42
7.4k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
36
2.8k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
51
3.3k
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.6k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
82
9.1k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.5k

Transcript

  1. © 2024 Wantedly, Inc. ウォンテッドリーでの KMPワークフロー Mobile勉強会#14 2024/05/21 久保出雅俊

  2. © 2024 Wantedly, Inc. wantedly.com/id/kubode @swiz_ard @kubode

  3. © 2024 Wantedly, Inc. Agenda • 弊社でのKMPのワークフローを紹介 • チーム構成や現状に至った経緯

  4. © 2024 Wantedly, Inc. Kotlin Multiplatform (KMP)

  5. © 2024 Wantedly, Inc. Kotlin Multiplatform

  6. © 2024 Wantedly, Inc. https://android-developers.googleblog.com/2024/05/android-support-for-kotlin-multiplatform-to-share-business-logic-across-mobile-web-server-desktop.html

  7. © 2024 Wantedly, Inc. ウォンテッドリーでのKotlin Multiplatform

  8. © 2024 Wantedly, Inc. 導入

  9. © 2024 Wantedly, Inc. 共通化レベル

  10. © 2024 Wantedly, Inc. Presentation Logic SearchReactor send(Action.Bookmark) state

  11. © 2024 Wantedly, Inc. Repository構成 KMP iOS Android SwiftPM Maven

    Publish Publish

  12. © 2024 Wantedly, Inc. Mobile Chapter チーム構成とコミット KMP iOS Android

    専門性 iOS Android Commit Commit

  13. © 2024 Wantedly, Inc. ワークフロー

  14. © 2024 Wantedly, Inc. 開発ワークフロー KMP インターフェー ス 設計・実装 KMP

    内部実装 iOS UI実装 Android UI実装 画面仕様 QA リリース 結合

  15. © 2024 Wantedly, Inc. 開発ワークフロー KMP インターフェー ス 設計・実装 画面仕様

    QA リリース • 仕様を元にStateとActionをモデリング、実装 ◦ KMP/iOS/Android全エンジニアがそれぞれの観点でレビュー • KMPの状態更新などの中身は実装しない KMP 内部実装 iOS UI実装 Android UI実装 結合

  16. © 2024 Wantedly, Inc. 開発ワークフロー KMP インターフェー ス 設計・実装 画面仕様

    QA リリース • KMPは内部の状態更新を実装していく • iOS/AndroidはStateをもとにPreview駆動開発 • UI実装とStateやActionに乖離があればフィードバック KMP 内部実装 iOS UI実装 Android UI実装 結合

  17. © 2024 Wantedly, Inc. 開発ワークフロー KMP インターフェー ス 設計・実装 画面仕様

    QA リリース • KMPの内部実装が進んだらiOS/Androidと結合を始める • 実装と結合の工程はきっちり別れずグラデーションで進行 • 結合時の課題はフィードバックして改善 KMP 内部実装 iOS UI実装 Android UI実装 結合

  18. © 2024 Wantedly, Inc. 開発ワークフロー KMP インターフェー ス 設計・実装 画面仕様

    QA リリース KMPでは、ここの並列化とフィードバック速度が重要 KMP 内部実装 iOS UI実装 Android UI実装 結合

  19. © 2024 Wantedly, Inc. 開発ワークフローの重要な工程 KMP インターフェー ス 設計・実装 画面仕様

    QA リリース 手戻りを減らす フィードバックを早く回す KMP 内部実装 iOS UI実装 Android UI実装 結合

  20. © 2024 Wantedly, Inc. KMPインターフェース設計・実装 KMP インターフェー ス 設計・実装 画面仕様

    QA リリース 手戻りを減らす KMP 内部実装 iOS UI実装 Android UI実装 結合

  21. © 2024 Wantedly, Inc. • 実装時の手戻りが多い課題があった ◦ KMPに破壊的変更を頻繁に入れる ◦ UI側で不足する状態が実装中に発覚

    • → 仕様整理や設計のレベルを上げよう！ KMPインターフェース設計・実装

  22. © 2024 Wantedly, Inc. KMPインターフェース設計・実装

  23. © 2024 Wantedly, Inc. KMPインターフェース設計・実装 • 手戻りがかなり減った • モデリングの手法も議論が起きて堅牢に ◦

    data class (直積) → sealed class (直和)

  24. © 2024 Wantedly, Inc. 結合 KMP インターフェー ス 設計・実装 画面仕様

    QA リリース フィードバックを早く回す KMP 内部実装 iOS UI実装 Android UI実装 結合

  25. © 2024 Wantedly, Inc. 結合 • 以前はKMPに手動でバージョンをつけてパッケージ化 ◦ KMPの結合までが非常に手間、心理的ハードル ◦

    結合のフィードバックが回しづらい

  26. © 2024 Wantedly, Inc. 結合 • CI/CDを整備、メインブランチマージで自動的にPR作成 ◦ iOS/Android側のPRをマージするだけに •

    朝会での相談などフィードバックの機会を増やす • 設計工程を手厚くしたことで結合時の手戻りも減った

  27. © 2024 Wantedly, Inc. まとめ

  28. © 2024 Wantedly, Inc. まとめ • 弊社でのKMPのワークフローを紹介 • 当たり前だけど設計は重要な工程 •

    CI/CDはフィードバックを回すためにも必須 • チーム内のコミュニケーションを活発に

  29. © 2024 Wantedly, Inc.