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
サロンアプリの技術的負債解消への取り組み
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
K-Torishima
June 08, 2023
Programming
610
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
サロンアプリの技術的負債解消への取り組み
価値提供スピードを上げるための技術的負債への向き合い方
https://dmm.connpass.com/event/284374/
K-Torishima
June 08, 2023
More Decks by K-Torishima
See All by K-Torishima
DMM.Swift #1 詳解 ViewModifier
k_torishima
2
890
Human Interface Guidelinesから読み解く標準アプリの素晴らしい体験
k_torishima
0
4.2k
Other Decks in Programming
See All in Programming
メールのエイリアス機能を履き違えない
isshinfunada
0
230
<title><a id="</title>君はこのHTMLをパースできるか"></a></title> #雑LT_study
pizzacat83
0
140
プロポーザルを書いてもらう
pvcresin
0
280
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
mfunaki
0
130
ITヒヤリハットを整理してみた ~ライフサイクルと原因から考える再発防止策~
koukimiura
1
140
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
4
1.9k
Cloudflare is Agents
chimame
0
150
「人を評価する AI」の設計と実装
ryoyanara
0
180
AI Engineeringは、AIプロダクトだけのものか? 〜AIがソフトウェアを作る時代の新しい当たり前〜 / No AI in your product. AI Engineering in your development.
rkaga
4
380
React本体のコードリーディング
high_g_engineer
1
140
Go言語とトイモデルで学ぶTransformerの気持ち / fukuokago23-transformer
monochromegane
0
160
Claude CodeとAgentCore Gatewayを繋ぐ際の認証認可 / Authentication and authorization when connecting Claude Code with AgentCore Gateway
har1101
1
250
Featured
See All Featured
Measuring & Analyzing Core Web Vitals
bluesmoon
9
950
Art, The Web, and Tiny UX
lynnandtonic
304
22k
The #1 spot is gone: here's how to win anyway
tamaranovitovic
3
1.1k
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
430
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Chasing Engaging Ingredients in Design
codingconduct
0
260
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
1
360
RailsConf 2023
tenderlove
30
1.5k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
330
The Curse of the Amulet
leimatthew05
2
14k
AI: The stuff that nobody shows you
jnunemaker
PRO
9
890
Leo the Paperboy
mayatellez
8
2.1k
Transcript
© DMM サロンアプリの技術的負債解 消への取り組み オンラインサロン事業部 鳥嶋 晃次
© DMM 自己紹介 鳥嶋 晃次 DMM.com イノベーション本部 オンラインサロン事業部 プロダクト開発チーム 2022年
合同会社DMM.com 中途入社 DMM歴半年たちました。 GitHub:K-Torishima Twitter:@k_torishima 2
© DMM アジェンダ 1. オンラインサロンアプリにおける技術的負債 2. これまでの取り組み 3. 負債と向き合うための取り組み 4.
現在の取り組みと未来の話 5. まとめ 3
© DMM 4 1. オンラインサロンアプリにおける技術的負債
© DMM ReactNativeによる技術的負債 歴史的背景によりReactNativeを採用し開発を行っていたが、現状のチームでは ReactNativeで開発するメリットが 少ないと感じていた 今後もReactNativeで開発を継続していくと、ビジネス面、開発面、採用面などへのデメリットが多くなってきてしまう (決してReactNativeが悪いとかではないです) 5 過去のスライドはこちら
https://speakerdeck.com/roana0229/dmmonrainsaronapurifalsereactnative-nil-swifthua-hefalsedao-falseri https://speakerdeck.com/hayatan/reactnative-falseahuriwo-swift-nizhi-kihuan-etemasu
© DMM 2. これまでの取り組み 6
© DMM ReactNativeからSwiftに移行を進める 1. Swiftで開発できるようにするための環境構築 • ビルド環境の整備 • ReactNative側の整備など 2.
Swift化基盤を作る • アーキテクチャの選定、 DMM社内推奨アーキテクチャである VIPERの採用 • マルチモジュール化で依存関係を縛る • ReactNativeとSwift間でのやりとりの構築 3. 段階的にSwift化する • 影響範囲少ない末端の画面から Swift化 • 新規機能実装時はSwiftで実装 7
© DMM 直近の取り組み 1. SwiftUIの積極的な採用 • Viewの構築 • Componentsなどの構築 •
新規機能における画面実装など 2. Swift化の初期段階で生んでしまった負債のリファクタリング • ViewControllerに責務を置いていた Viewの振る舞いに関するコードを SwiftUIに寄せる • ライブラリアップデートや、 Cocoapodsを脱却しSPMに移行 • なかなか手のつけられていなかった開発環境に関する細かなメンテナンスや CIのメンテナンスなど 8
© DMM 9 3. 負債と向き合うための取り組み
© DMM 開発チームでの取り組み • Human Interface Guidelines輪読会の実施 iOSアプリ開発に関わるメンバーでの共通認識を持ち、 Swift化を進めていく上でより iOSアプリらしいUI、UXを提供
できるような取り組みを実施しました 輪読会を行ったことによって、 デザインレビュー時にエンジニア・デザイナー間で、共通の言語で根拠ある議論 (HIGを引用したりなど)をしやすくなり ました 10
© DMM iOSメンバーでの取り組み 1. iOSメンバーでのMTGの実施 • 隔週でiOSメンバーでのMTGを実施し、技術的にどんな課題があるかや、他社の事例紹介、競合、類 似アプリの調査など積極的に改善策をあげてチームでの意識を高める取り組みを行なっています 2. 事業部全体への展開
• 開発チーム内だけでなく事業部への共有をスプリントレビューで共有し、現在どんなことをやっている かなどを事業部全体に展開しております • 改善系のタスクは成果が見えにくいところがあるので開発者側から積極的に共有していくことを意識し て取り組んでいます 11
© DMM 12 4. 現在の取り組みと未来の話
© DMM 現在 1. Swift化に向けてた取り組み • ReactNativeのコードが存在しない Swift製のリファレンスアプリを作成 • Swift
Concurrencyの対応 • SPM化 • OSのサポートをiOS16以上を前提とし、SwiftUIベースのアーキテクチャの選定 • よりスピーディーに機能をデリバリーできるようにするための UI構築基盤設計 2. 分析など • GA4をフル活用できるようにするためのデータ分析基盤設 計 3. 改善タスク • 既存機能で改修が必要な箇所 の洗い出し、UIの見直しなど • 仕様の再定義 13
© DMM 未来 • ReactNativeがプロダクトコードからなくなりiOSエンジニアの本領が発揮できる環境になり 爆速開 発できるようになる • 継続的に安定した品質を保ちアプリ開発ができる基盤が形成される •
アプリのデータ分析基盤が構築され、よりデータに基づいた施策が実施できるようになる • 新規機能がより開発しやすくなり、今まで以上に事業施策にコミットできるようになる • テストコードの充実 • iOSエンジニアを採用しやすい環境となる 14 明るい未来が待っています!!!
© DMM まとめ • 技術負債への向き合い方は色々ある • チームで共通認識を持つことは非常に大事 • 決してReactNativeという技術は負債ではない •
負債はその時その時の状況で変わるので柔軟に対応するべき • 組織に共有することは非常に大切、知ってもらうために技術者から発信する • 楽しんでやった方がより良いものづくりになります 15
© DMM 16 ありがとうございました