Initial setup - Installation | React Native Firebase
アプリ作成
ベースのアプリを作成する
react-native initでアプリのプリジェクトファイルを作成します。
react-native init firebase1
作成されたフォルダをVisual Studio Codeで開きます。
react-native-firebaseの追加
VS Codeのターミナルから以下コマンドを打ち、react-native-firebaseを追加します。
npm install --save react-native-firebase
Firebase
新しいプロジェクトを作成
コンソールから新しいプロジェクトを作成します。
Firebase console
以下に沿ってGoogleService-Info.plistのダウンロードまで進みます。
React-Native-Firebaseを試して見る - Qiita
プロジェクトフォルダ配下の以下に保存します。
ios/[YOUR APP NAME]/GoogleService-Info.plist
AppDelegate.m
iOS - Installation | React Native Firebase
ios/[YOUR APP NAME]/AppDelegate.m file
#import <Firebase.h>
と[FIRApp configure];
を追加します。
以下のような感じになります。
#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import <Firebase.h>
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[FIRApp configure];
NSURL *jsCodeLocation;
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
以下略
Install Firebase Library
Cocoapodsを使用してFirebase SDKをインストールすることを推奨しているとの事です。
Podfile 作成。
Podfile がない場合は作成します。
Firebase を iOS プロジェクトに追加する | Firebase
cd ios
pod init
Podfileができます。
tvOSTestsが2回宣言されているようですが、これはバグのようです。
tvOSTestsを削除します。
Podインストール
以下コマンドでインストールします。
pod install
UPDATEもやっときます。
pod update
Link React Native Firebase
プロジェクト直下のフォルダに移動して以下コマンドを打ちます
react-native link react-native-firebase
結果
Scanning folders for symlinks in /Users/atsu/react_native/Firebase/firebase1/node_modules (19ms)
rnpm-install info Linking react-native-firebase ios dependency
rnpm-install info Platform 'ios' module react-native-firebase has been successfully linked
rnpm-install info Linking react-native-firebase android dependency
rnpm-install info Platform 'android' module react-native-firebase has been successfully linked
サンプルアプリ
ようやくここに戻ってこれました。
Initial setup - Installation | React Native Firebase
import firebase from 'react-native-firebase';
firebase.auth()
.signInAnonymouslyAndRetrieveData()
.then(credential => {
if (credential) {
console.log('default app user ->', credential.user.toJSON());
}
});
pod 'Firebase/Auth'
pod install
react-native run-ios
podのインストールやりなおし
cd ios
rm -rf Pods/
pod install
rm -rf node_modules/
npm i