
どうも、まつまるです。あ~お腹すいた。
この記事ではColud Firestoreを使うための準備がメインです。
前提
Flutterの環境構築は済んでいる
Googleアカウントを持っている
Flutterの環境構築は済んでいる
Googleアカウントを持っている
基本は公式サイトの通りに説明していきます。
ステップ1:Firebaseプロジェクトを作成する
まずはFirebaseのサイトに飛びましょう。
■

■
使ってみるをクリック
使ってみるをクリック
■

■
プロジェクトを作成
■

■プロジェクト名を入力
■

■
適当な名前をつけて、Firebaseの規約に同意したら続行!
適当な名前をつけて、Firebaseの規約に同意したら続行!
■

■
特に変更しなくてOK
特に変更しなくてOK
■

■
Googleアナリティクスアカウントがあれば選択する。無ければ作成しましょう。
Googleアナリティクスアカウントがあれば選択する。無ければ作成しましょう。
■

■
この画面がでればOK
この画面がでればOK
■

■
これでFirebaseプロジェクトが立ち上がりました。
これでFirebaseプロジェクトが立ち上がりました。
ステップ2:アプリをFirebaseに登録する
iOSとandoridで手順が変わってくるので、必要に応じて設定しましょう。(Flutterやっているならどっちも必要だよね)
iOSバージョン
■

■
iOSをクリック
iOSをクリック
■

■
次はiOSバンドルIDを入力します。バンドルIDを確認するためにandroid studioを開きましょう。
次はiOSバンドルIDを入力します。バンドルIDを確認するためにandroid studioを開きましょう。
■

■
android studioで作成しているプロジェクトからiosディレクトリを右クリックしてXcodeを開く。
android studioで作成しているプロジェクトからiosディレクトリを右クリックしてXcodeを開く。
■

■
Xcodeを開たら、RunnerのGeneralにBundle Identifierをコピー。
Xcodeを開たら、RunnerのGeneralにBundle Identifierをコピー。
■

■
Firebaseの画面に戻って貼り付ける。アプリのニックネームはなんでも良いです。App Store IDは省略。アプリ登録をクリック。
Firebaseの画面に戻って貼り付ける。アプリのニックネームはなんでも良いです。App Store IDは省略。アプリ登録をクリック。
■

■
登録できたらGoogleService-Info.plist ファイルをダウンロードしてXcode プロジェクトに移動。
登録できたらGoogleService-Info.plist ファイルをダウンロードしてXcode プロジェクトに移動。
■

■
Xcodeを開いて、Runner配下に先ほどダウンロードしたファイルをドラック&ドロップしましょう。
Xcodeを開いて、Runner配下に先ほどダウンロードしたファイルをドラック&ドロップしましょう。
■

■
終われば、”次へ”をクリックしましょう。
終われば、”次へ”をクリックしましょう。
■

■
Firebase SDKの設定はスキップするので、この画面が出てきたら何もせずに”次へ”をクリックしましょう。
Firebase SDKの設定はスキップするので、この画面が出てきたら何もせずに”次へ”をクリックしましょう。
■

■
ここも何もせず”次へ”をクリック。
ここも何もせず”次へ”をクリック。
■

■
コンソールに進んで、次のステップに行きましょう。
コンソールに進んで、次のステップに行きましょう。
androidバージョン
■

■
アプリを追加
アプリを追加
■

■
andoridを選択
andoridを選択
■

■
パッケージ名はandroid studioで確認します。
パッケージ名はandroid studioで確認します。
■

■android studioで⌘+shift+Oで検索画面が出てくるのでManifest.xmlのmainを開いてください。
■

■開いたところのpackage名をコピーしましょう。
■

■
入力してアプリを登録
入力してアプリを登録
■

■次はダウンロードした google-services.json ファイルを Android アプリモジュールのルートディレクトリに移動
■

■Firebase 構成ファイルを追加する
■

■ルートレベル(プロジェクトレベル)の Gradle ファイル(android/build.gradle)に、Google サービスの Gradle プラグインを含めるためのルールを追加classpath ‘com.google.gms:google-services:4.3.5’
■

■モジュール(アプリレベル)の Gradle ファイル(通常は android/app/build.gradle)で、Google サービスの Gradle プラグインを適用
apply plugin: ‘com.google.gms.google-services’
apply plugin: ‘com.google.gms.google-services’
app/build.gradleに
multiDexEnabled true
implementation "androidx.multidex:multidex:2.0.1"
を追加。
参考にしたのはこちら
ステップ3:Cloud Firestoreのデータベースを作成
■

■データベースの作成をクリック。
■

■まずはテストモードで開始します
■

■ロケーションはひとまずnam5にしておきます。
■

■無事にデータベースを作成できたらこんな画面になります。
■

■コレクションを開始して、データベースに適当なドキュメントを作っていきたいと思います。コレクションIDはitemにします。名前はなんでもいいです。
■

■フィールドと値にデータを任意で入力します。
■

■ドキュメントIDは自動IDをクリックしたら勝手に作ってくれます。入力したら保存しましょう。
■

■
ちゃんと追加されていますね。
ちゃんと追加されていますね。
ステップ4:FlutterFire プラグインを追加する
①エミュレータまたはデバイス上で、アプリが実行されていないことを確認します。
②Flutter アプリのルート ディレクトリから、pubspec.yaml ファイルを開きます。
③pubspec.yamlにfirebase_core: ^1.0.0を追加。
④アプリで使用するFirebaseプロダクトを追加。今回はcloud_firestore: ^1.0.0を使って、テキストを保存してみます。以下のようにコピペすればOKです。
⑤pub getをクリックしてパッケージをゲットしましょう。
準備がだいぶ長かったですが、これでひとまず準備完了です。