弊社ではiOS/Android向けアプリの開発に、Expo + React Nativeを利用しています。
Expoを使えば使うほど、その便利さに感動しています。
今回は、Expoを使うとどんな嬉しいことがあるか？について書いてみたいと思います！

Expoとは

ExpoとはReact Nativeアプリの開発を支援してくれるツールです。

https://expo.io/

ビルドや実行環境が提供され、JSでReact Nativeのコードを書くだけ（XcodeやAndroid Studio不要）でiOS, Androidアプリの開発が可能になります。
使用方法については、別途書きたいと思います。

弊社ではExpoを利用したアプリをリリースして3ヶ月ほど経ちましたが、その恩恵を大いに感じています。
以下、メリットを5つ選んでまとめてみました！

メリット① 変更がリアルタイムに反映されるのでWeb感覚で開発できる

Expoクライアントアプリを用いると、コードの改修が即時にアプリに反映されます。このExpoアプリは、シミュレータでも実機でも使えます。

例えば、何らかのエディタ、iOSシミュレータを使って開発していた場合、
エディタでJSのコードを改変すると、自動的にJSがコンパイルされiOSシミュレータ内のExpoアプリに反映されます。

コード変更したら、ビルドして、アプリ起動して、、みたいな手間が省けます。
感覚的にはWebサービスを作ってて、ブラウザで確認しているのに近いです。

f:id:wasan:20180405160818p:plain

メリット② Apple審査なしでアップデートできる

iOSアプリを更新する際は、本番用アーカイブをビルドして、iTunes Connectにアップロードして、申請して、、、そしてApple審査、という流れになると思います。
なんだかんだ半日は作業時間を取られるのではないでしょうか。

また、Androidは審査がないものの、iOSと別にビルド&申請の作業が必要になります。

立ち上げ期のサービスだと、施策と検証の数がものを言うので、この手間は痛手です。

ところが、Expoを利用していた場合、アプリの挙動を定義するJSバンドルだけを差し替えることが出来るので、このビルドや申請の作業が不要になります。
もちろんiOS、Android同時に更新されます。

具体的には

exp publish

とコマンドを叩くだけで最新コードでJSバンドルが作成され本番にアップロードされます。
アプリの起動時に最新のJSバンドルを落としてくるので、既存のユーザーはアプリ再起動するタイミングで最新版が反映されます。

まるでWebサービスをdeployする感覚です。

f:id:wasan:20180405160836p:plain

ちなみにこのあたりは、Expoを使ってない場合、CodePush + React Nativeでも実現できるようです。

メリット③ 本番用のビルドがコマンド一発。Xcodeすら不要

Expoで開発したアプリは、App StoreやGoogle Playにて配布することも、もちろん可能です。

その際は、本番用のビルドを作成することになるのですが、
その方法は…以下のようなコマンドを実行するだけです。

exp build:ios
exp build:android

Expoのサーバー側でiOS用にipa、Android用にapkを作ってくれます。
しばらくするとipa, apkのダウンロードURLが表示されるので、
あとはそれをダウンロードしてiTunes ConnectやAndroid Developer Consoleから申請すればOKです！

メリット④ iOSのややこしいプロビジョニングプロファイルから解放される

iOSアプリを作っていて面倒な作業に、プロビジョニングプロファイルの作成があります。
そもそも概念が分かりにくい上に、たまにしかしない作業なので、毎回調べながらの作業で億劫になります…

Expoの場合、これらのプロビジョニングプロファイル管理を全てExpoに任せることが出来ます。
プッシュ通知のキーの作成もできます。

本番用のビルドを作成するときに、Apple ID、パスワード、組織IDなどを入れれば、勝手にそのアプリのプロビジョニングとかが作られます。

個人的にはこれが涙モノに嬉しいです。

メリット⑤ プッシュ通知の実装が楽

Expoがプッシュ通知の送信サーバーを提供しています。
これを利用すると、あるエンドポイントにPOSTでメッセージを送るだけで、プッシュ通知を送ることができるので、
iOS(APNS), Android(GCM)の区別を意識しなくてよくなります。

具体的な手順は以下のような感じです。

アプリ側でpushトークンを取得する
このtokenはExpoが端末毎に発行するトークンでExponentPushToken[xxxxxxxxxxxxxxxxxxxxxx]のような形式になります。
これをサーバ側で保存しておきます。
push通知の送信
サーバ側でhttps://exp.host/—/api/v2/push/sendというエンドポイントにPOSTで

{
  "to": "ExponentPushToken[xxxxxxxxxxxxxxxxxxxxxx]",
  "title":"hello",
  "body": "world"
}

のようなデータを送ればOKです。
あとはExpoのサーバ側でiOS/Androidを判断して対象の端末にプッシュ通知を送ってくれます。

Expoの欠点

良いところを色々書きましたが、欠点もあります。
それは「ネイティブモジュールを自由に使えない」ということです。
もう少し正確に言うと、Expoがラップしてくれてるネイティブモジュールは使えるけど、そうでなければ使えない、ということになります。

何らかの特殊な機能を実装したい場合はExpo上だと実現できない可能性があります。

とは言え、基本的な機能はExpoがカバーしてくれていて、その機能もどんどん増えています。
弊社では、写真・動画投稿系のSNSアプリを開発していますが、今のところExpo上の開発で問題ありません。

もしどうしてもネイティブモジュールを使いたい場合は、Detatchという処理をするとExpoを抜け出して、XcodeやAndroid Studioでビルドできるようになります。
しかしその場合、上で書いたようなExpoの恩恵は全て受けられなくなります。

なので弊社では、開発効率のために意地でもDetatchせずに進めています。

以上、Expoを使っていて感じたメリットでした！
具体的な使い方なども書いていきたいと思います！

【追記】

本記事がなんと本家のExpoブログに翻訳のうえ掲載されました🎉

blog.expo.io

React Native Tech Blog

supported by maricuru (旧maricuru tech blogです)

ExpoでReact Nativeアプリを開発するメリット5選