FirebaseはスマホやWebアプリのバックエンドとして非常に優秀で、認証や通知、分析にストレージ・DBなど幅広い用途で使用することができます。 ReactNativeアプリでもライブラリであるreact-native-firebaseが提供されているため比較的簡単に組み込むことができます。 今回はそのセットアップ手順をご紹介します。
react-native@0.63.3Firebaseプロジェクトは作成済み以下に公式サイトがあります。
現在はv6系が最新となります。
react-native-firebaseにはいくつも機能があるため、ライブラリが分かれています。
基本となるのは@react-native-firebase/appで、これはいかなる機能を使う場合もインストールする必要があります。
yarn add @react-native-firebase/appiOSで利用する場合はpod installを行います。
cd ios && pod install既にFirebase側でプロジェクトは作成済みだと思いますので、【プロジェクトの概要】のアプリの追加からandroidとiosアプリを作成しましょう。
その過程で、google-service.jsonとGoogleService-Info.plistという2種類のファイルをダウンロードしたと思います。
それぞれgoogle-service.jsonはandroid/appの直下、GoogleService-Info.plistはXCodeから/ios/{プロジェクト名}.xcworkspaceの直下へ追加しましょう。
これで準備は完了です。
以下にreact-native-firebaseで利用できる機能を紹介します。
アプリ内広告に関する機能です。 広告の表示位置等を調整できます。
アプリログ解析に関する機能です。
本家GoogleAnalyticsのように各画面の表示回数や操作傾向などを、ログを埋め込むことで解析できます。
認証に関する機能です。
一般的なメールアドレス登録や、Google等の外部サイトのOAuth認証を行うことができます。
NoSQLのクラウドデータベース機能です。
ユーザー情報や、アプリで使用するデータの格納等で使用します。
サーバーレスで実行できる関数です。 アプリ側から事前に定義した処理を呼び出すことができます。
いわゆるプッシュ通知の機能です。
クラウドストレージ機能です。 例えば、プロフィール画像等を格納することができます。
クラッシュレポート機能です。 どういった操作でクラッシュしたかの追跡等に便利です。
特定のURLが実行された場合、アプリを呼び出す機能です。
Webサービスを既に持っており、アプリがインストールされている場合のみアプリで表示させたい場合などに便利です。
特定の条件下でポップアップやバナーを表示させる機能です。 期間限定のキャンペーン通知などを、アプリに変更を加えることなく表示できます。
デバイスを一意に紐づけるインスタンスIDの機能です。 他の様々な機能のベースとして使われることが多いです。
テキスト認識(OCR)や翻訳、顔識別など機能です。
カメラやマイク機能と組み合わせて使用します。
画像認識に関する機能です。
上記のML Kit Natural Language同様、カメラ機能や写真機能と組み合わせて使用します。
アプリのパフォーマンス解析機能です。 起動時間やリクエスト、パフォーマンスが悪い箇所の解析に使用します。
クラウドデータベースです。
今後は、先のCloud Firestoreを推していくようです。
アプリの設定機能です。
今までアプリにconfigとして組み込んでいたデータをクラウドにおく事で、アプリの更新をすることなく変更を加えることができます。
今回はreact-native-firebaseのセットアップと、利用できる機能一覧についてご紹介しました。
個別の機能についてはボリュームも大きいため、別記事に起こしていく予定です。
Firebaseはサーバサイドに欲しい機能のほとんどをカバーしているため、フロントはReactNativeでサーバーサイドはFirebaseだけで済んでしまうことも多いです。
そのため今後利用機会が多くなることが予想されるので、その際の導入の手引きになれば幸いです。