React NativeとExpoで爆速アプリ開発

Transcript

1. Seiya Yoshitaka React Native + Expo で爆速アプリ開発
2. ⾃自⼰己紹介 • Seiya Yoshitaka • twitter @__yo7__ • github yo7 • Japan Venture Research Co., LTD. • entrepedia • ami https://ami.live • React Native / TypeScript / Ruby on Rails / Kotlin / GKE・ Kubernetes / Firebase etc…
3. 今⽇日話すこと • React Nativeでは⼤大変で、Expoが解決してくれること • Expoが提供してくれる爆速・簡単なアプリ開発体験 • Expoではできないこと、そして別れ、、
4. React Native • iOS / Android マルチプラットフォームなアプリを
 JavaScript / Reactで書ける • ハイブリッドアプリやガワネイティブではない、
 モノホンのネイティブアプリ
5. React Native • iOS / Androidの開発・デバッグやビルドツール・
 リリース周りとか、Webエンジニアにはつらい… • テスト版の配布（TestFlight / Fabric / DeployGate etc）に もはまりどころがたくさんあって⼤大変
6. そこでExpo • https://expo.io/ • ネイティブモジュールが使えない制約がある代わりに、 ⾼高速な開発＆⾼高いDXを実現する仕組みが • React Nativeの公式ドキュメントも”Quick Start”でExpoで のアプリ開発の流れが書かれていて、推されている
7. かんたんに実機でデバッグ • `$ yarn start` アプリ起動するとコン ソールにQRコードが、、 • Expo Clientをインストールしてお いて、QRコードを読むだけで実機 デバッグできる！
8. テスト版の配布もかんたん • テストしてほしいチームのメンバーにExpo Clientをインストールしてもらう • アプリをexpo.ioにデプロイして⽣生成されたQRコードをExpo Clientで読むだ け（つまり、Expoプロジェクトのホスティングサービスでもある） • apprを使えばCIにコマンドを⼀一つ追加するだけでPull Requestのたびに⾃自動 でデプロイしてくれる
 https://github.com/FormidableLabs/appr
9. 他にも・・・ • Expo SDKが提供しているAPIに含まれるものに限り、ネイティブモ ジュールも使えます
 https://docs.expo.io/versions/latest/sdk • ImagePicker / Camera / Location / 認証周りなど割といろいろある
 （これで事⾜足りる！と⾔言うわけではないですが、、） • Push通知⽤用のPaaSをExpoが⽤用意してくれていたりもする
 （FCMの簡易易版のようなもの） • ⾃自分でまだやっていないのですが、expというCLIでアプリのApp Store ConnectやGoogle Playへのデプロイも任せられるみたい
10. Expoとの別れ • Expoは、Expoが提供している以外のネイティブモジュー ルを使いたくても使えない • いまつくっているアプリ（ami）は、もともとテキストが メインだったが、開発の中でライブ動画アプリに • Expoでつくっていたアプリをやめ、別のReact Nativeアプ リを新規につくって既存アプリを移植していく • 依存していた通知やテスト版配布環境の再構築
 が必要に
11. だけど、ありがとうExpo • 環境構築に時間をかけずにReact Nativeに慣れることがで き、⾼高速にプロトタイピングできた • それまでに享受したメリット ＞ やめるときのコスト • Expo + React Nativeのアプリ開発は楽しかった！
 またアプリをつくるときにはこのスタックでやりたい
12. まとめ • React NativeはReactでアプリが書けて最⾼高だけど、 ネイティブの知識がないとちょっと⼤大変 • 要件次第では、Expoを使えば爆速＆DX⾼高くアプリを作 れるので、積極的に使っていきましょう！