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
ReactNative のアプリを Swift に置き換えてます
Search
hayatan
February 24, 2021
Technology
0
570
ReactNative のアプリを Swift に置き換えてます
DMM meetup #26 〜とある事業が抱える課題と改善に向けた取り組み〜
https://dmm.connpass.com/event/203927/
hayatan
February 24, 2021
Tweet
Share
More Decks by hayatan
See All by hayatan
DMMオンラインサロンアプリのSwift化
hayatan
0
310
アプリ内課金 リジェクトとAppleとのやり取りのお話
hayatan
1
1.5k
Other Decks in Technology
See All in Technology
ビジネスモデリング道場 目的と背景
masuda220
PRO
9
500
地方拠点で エンジニアリングマネージャーってできるの? 〜地方という制約を楽しむオーナーシップとコミュニティ作り〜
1coin
1
220
Cloud Spanner 導入で実現した快適な開発と運用について
colopl
1
550
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
6
57k
目の前の仕事と向き合うことで成長できる - 仕事とスキルを広げる / Every little bit counts
soudai
24
7k
Classmethod AI Talks(CATs) #16 司会進行スライド(2025.02.12) / classmethod-ai-talks-aka-cats_moderator-slides_vol16_2025-02-12
shinyaa31
0
100
Larkご案内資料
customercloud
PRO
0
650
技術的負債解消の取り組みと専門チームのお話 #技術的負債_Findy
bengo4com
1
1.3k
Developers Summit 2025 浅野卓也(13-B-7 LegalOn Technologies)
legalontechnologies
PRO
0
660
SA Night #2 FinatextのSA思想/SA Night #2 Finatext session
satoshiimai
1
140
関東Kaggler会LT: 人狼コンペとLLM量子化について
nejumi
3
570
Amazon S3 Tablesと外部分析基盤連携について / Amazon S3 Tables and External Data Analytics Platform
nttcom
0
130
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
693
190k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
Visualization
eitanlees
146
15k
What's in a price? How to price your products and services
michaelherold
244
12k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
The Cost Of JavaScript in 2023
addyosmani
47
7.3k
Done Done
chrislema
182
16k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.6k
Bash Introduction
62gerente
611
210k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Transcript
DMM MEETUP #26 React Native Swift ⼤⾨弘明 で書かれたアプリを で書き直しています
⾃⼰紹介 About me ⼤⾨弘明 合同会社DMM.COM エンターテインメント本部 オンラインサロン事業部 2014年: 新卒⼊社 いくつかのiOSアプリの保守や新規開発をするなど
2020年: オンラインサロン事業部にジョイン 主にiOSアプリを担当している
⽇ すこと A brief outline 僕にとって React Native はつらい React
Native to Swift は つらいが 理ではない ↑のような気持ちと の
僕にとってReactNativeはつらい
ライブ オーナーから 知 タイムライン Product 専⽤コミュニティアプリ 「DMM オンラインサロン専⽤コミュニティ」 を⽤いたサロンの 員専⽤のiOS
アプリ。
つらいこと React Native が負債に アップデートがしんどい
アップデートがしんどい そもそもしんどい Apple に従う ( OS, ATS, UIWebView...) これはどのみちつきまとう ReactNative
のアップデートがしんどい Xcode, RN, ライブラリ すべて動作するように 性のなくなるライブラリがある 式じゃないからRN ⾃体が いで、ライブラリはさらに そもそも僕は React Native がわからない Web フロントの技 は専⾨ アロー , スプレッド構 を ⽤した の羅列つらい
React Native が負債に iOS / Swift / JS / React
Native すべての い理 が必 当 はフロントエンドエンジニア主 で開発 iOS エンジニアがいなかった当時としてはベストな 択 iOS エンジニアを れてスピード/ 品 Up るが・・・ 度は JS, React Native が⾜かせに 得 野を⽣かせずつらい React Native を利⽤している 味はあまりない iOS のみ このまま使い けていくとデメリットの に苦しめられる
つらいこと React Native のアップデート もするからしんどい iOS エンジニアがJOIN したが スピードを し切れない
→Swift化して負債脱却しよう! React Native が負債に アップデートがしんどい
React Native → Swift は つらいが 理ではない React Native →
Swift
Swift の流れ Xcode, React Native を に Swift 基 を作る
的に Swift する
Swift の流れ Xcode, React Native を に Swift 基 を作る
的に Swift する
Xcode, React Native を に まずはビルドできるように Xcode と React Native
を にしてビルドが るまでエラーを り いていく → ひたすらトライアンドエラー npm のライブラリが していない場 npm の ライブラリがアップデートできない場 がある アップデートすると動作が保 できないやつ のXcode, React Native に していないやつ PR 状 でマージされてないやつ → patch-package を利⽤する
patch-package npm でインストールしたライブラリに パッチを当ててくれるツール https://github.com/ds300/patch-package ネイティブ にも利⽤可 Objectice-C(.m) ファイル や
podspec ファイル等も 正できる
patch-package 例: Podspec のReact だけ 正したい場 Xcode12 でビルドするために React を
React-Core に 更する必 があった。
Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り
いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 的に Swift する
Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り
いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 的に Swift する
内 奨アーキテクチャ VIPER ライクの 内 奨アーキテクチャを採⽤して 技 の流動 を る
React Native も1 つのモジュールとして利⽤ マルチモジュール で いずれ消えゆく React Native も1 つのモジュールとして、 ネイティブに ⾏した や ⾯からは しないように で る
Presenter⾃体は 状態を持たない Interacterは機能の呼び出しや ドメインの取得を⾏う
None
画⾯や機能のまとまりごとにFeatureモジュールを作る 画⾯や機能のまとまりごとにFeatureモジュールを作る ReactNative部分は1つのFeatureとしてモジュール化する ReactNative部分は1つのFeatureとしてモジュール化する
None
RN と Swift 間のやりとり Pub/Sub メッセージングモデル イベントを 知するSubject(Combine) 流れるのはイベントのオブジェクト(enum) Swift
へのメッセージ ⽤のメソッドはRN 側に 開 RN へのメッセージ ⽤のメソッド イベントオブジェクト(enum) を Dictionary に してRN に 知 処理 にI/F を やしていくのは けたい I/F を やすには ObjC のコーディング ( マクロ 義) も必 メソッド に やしていくのはしんどい
None
コードの⼀ receivedEvent(受信⽤) notifyToRN(送信⽤) Swift側からは、 を意識すればよい
Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り
いていく npm のライブラリが していない場 patch-package を利⽤して 正 的に Swift する Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に
Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り
いていく npm のライブラリが していない場 patch-package を利⽤して 正 的に Swift する Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に
的に Swift する 範囲の ない末 の ⾯からSwift 中で中 して の開発とかもあるかもしれない
Swift が に ⾏せずともアプリはリリースできる状 に Swift → RN → Swift → RN となる はしない 単 にコントロールが しい が になる
None
第2弾 第3弾 ... 第1弾
Swift の流れ Xcode, React Native を に ビルドが るまでエラーを り
いていく npm のライブラリが していない場 patch-package を利⽤して 正 Swift 基 を作る 内の 奨アーキテクチャで技 の流動 マルチモジュールで を る Pub/Sub で RN <-> SWift を簡 に 的に Swift する 範囲の ない末 の ⾯からSwift
まとめ 僕にとって React Native はつらい アップデートがしんどい ReactNative が負債 React Native
→ Swift はつらいが 理ではない patch-package を利⽤して未 のライブラリ 正 マルチモジュール で を に Pub/Sub メッセージングモデル で RN<-> Swift 間のを簡 に 範囲の ない末 の ⾯からSwift
おわり