ReactNative のアプリを Swift に置き換えてます

DMM meetup #26 〜とある事業が抱える課題と改善に向けた取り組み〜
https://dmm.connpass.com/event/203927/

Transcript

1. DMM MEETUP #26 React Native Swift ⼤⾨弘明 で書かれたアプリを で書き直しています
2. ⾃⼰紹介 About me ⼤⾨弘明 合同会社DMM.COM エンターテインメント本部 オンラインサロン事業部 2014年： 新卒⼊社 いくつかのiOSアプリの保守や新規開発をするなど 2020年： オンラインサロン事業部にジョイン 主にiOSアプリを担当している
3. ⽇ すこと A brief outline 僕にとって React Native はつらい React Native to Swift は つらいが 理ではない ↑のような気持ちと の
4. 僕にとってReact
   Nativeはつらい
5. ライブ オーナーから 知 タイムライン Product 専⽤コミュニティアプリ 「DMM オンラインサロン専⽤コミュニティ」 を⽤いたサロンの 員専⽤のiOS アプリ。
6. つらいこと React Native が負債に アップデートがしんどい
7. アップデートがしんどい そもそもしんどい Apple に従う ( OS, ATS, UIWebView...) これはどのみちつきまとう ReactNative のアップデートがしんどい Xcode, RN, ライブラリ すべて動作するように 性のなくなるライブラリがある 式じゃないからRN ⾃体が いで、ライブラリはさらに そもそも僕は React Native がわからない Web フロントの技 は専⾨ アロー , スプレッド構 を ⽤した の羅列つらい
8. React Native が負債に iOS / Swift / JS / React Native すべての い理 が必 当 はフロントエンドエンジニア主 で開発 iOS エンジニアがいなかった当時としてはベストな 択 iOS エンジニアを れてスピード/ 品 Up るが・・・ 度は JS, React Native が⾜かせに 得 野を⽣かせずつらい React Native を利⽤している 味はあまりない iOS のみ このまま使い けていくとデメリットの に苦しめられる
9. つらいこと React Native のアップデート もするからしんどい iOS エンジニアがJOIN したが スピードを し切れない →
   Swift化して負債脱却しよう！ React Native が負債に アップデートがしんどい
10. React Native → Swift は つらいが 理ではない React Native → Swift
11. Swift の流れ Xcode, React Native を に Swift 基 を作る 的に Swift する
12. Swift の流れ Xcode, React Native を に Swift 基 を作る 的に Swift する
13. Xcode, React Native を に まずはビルドできるように Xcode と React Native を にしてビルドが るまでエラーを り いていく → ひたすらトライアンドエラー npm のライブラリが していない場 npm の ライブラリがアップデートできない場 がある アップデートすると動作が保 できないやつ のXcode, React Native に していないやつ PR 状 でマージされてないやつ → patch-package を利⽤する
14. patch-package npm でインストールしたライブラリに パッチを当ててくれるツール https://github.com/ds300/patch-package ネイティブ にも利⽤可 Objectice-C(.m) ファイル や podspec ファイル等も 正できる
15. patch-package 例: Podspec のReact だけ 正したい場 Xcode12 でビルドするために React を React-Core に 更する必 があった。
16. Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 的に Swift する
17. Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 的に Swift する
18. 内 奨アーキテクチャ VIPER ライクの 内 奨アーキテクチャを採⽤して 技 の流動 を る React Native も1 つのモジュールとして利⽤ マルチモジュール で いずれ消えゆく React Native も1 つのモジュールとして、 ネイティブに ⾏した や ⾯からは しないように で る
19. Presenter⾃体は 状態を持たない Interacterは機能の呼び出しや ドメインの取得を⾏う
21. 画⾯や機能のまとまりごとにFeatureモジュールを作る 画⾯や機能のまとまりごとにFeatureモジュールを作る ReactNative
    部分は
    1つのFeatureとしてモジュール化する ReactNative
    部分は
    1つのFeatureとしてモジュール化する
23. RN と Swift 間のやりとり Pub/Sub メッセージングモデル イベントを 知するSubject(Combine) 流れるのはイベントのオブジェクト(enum) Swift へのメッセージ ⽤のメソッドはRN 側に 開 RN へのメッセージ ⽤のメソッド イベントオブジェクト(enum) を Dictionary に してRN に 知 処理 にI/F を やしていくのは けたい I/F を やすには ObjC のコーディング ( マクロ 義) も必 メソッド に やしていくのはしんどい
25. コードの⼀ receivedEvent(受信⽤) notifyToRN(送信⽤)
    Swift側からは、 を意識すればよい
    
26. Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り いていく npm のライブラリが していない場 patch-package を利⽤して 正 的に Swift する Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に
27. Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り いていく npm のライブラリが していない場 patch-package を利⽤して 正 的に Swift する Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に
28. 的に Swift する 範囲の ない末 の ⾯からSwift 中で中 して の開発とかもあるかもしれない Swift が に ⾏せずともアプリはリリースできる状 に Swift → RN → Swift → RN となる はしない 単 にコントロールが しい が になる
30. 第2弾 第3弾 ... 第1弾
31. Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に 的に Swift する 範囲の ない末 の ⾯からSwift
32. まとめ 僕にとって React Native はつらい アップデートがしんどい ReactNative が負債 React Native → Swift はつらいが 理ではない patch-package を利⽤して未 のライブラリ 正 マルチモジュール で を に Pub/Sub メッセージングモデル で RN<-> Swift 間のを簡 に 範囲の ない末 の ⾯からSwift
33. おわり