nekoblog

nekoblog

ちょっとためになるブログ

Flutter アプリに Firebase を追加する

Firebase Flutter

はじめに

Flutter によるスマホアプリ開発 で、Flutterの開発環境構築とプロジェクトを作成する方法をまとめました。

スマホアプリとして、質の高いサービスを配信/運用するには「アプリのアクセス/クラッシュ解析」や「PUSH通知」や「ログイン認証」など、多くの機能が必要になります。このような機能は、Firebaseを使用すると簡単に実装することが出来ます。

Firebase は、優れたアプリを開発し、ユーザーベースを拡大、収益を高めるためのツールです。Firebaseを使えば、インフラ構築に手間取ることなくビジネスを収益化し、効率よくアプリを開発し、運用・管理することができるようになります。

Flutterで作成したプロジェクトにFirebaseを追加する方法を備忘録としてまとめます。

事前準備

実装

Flutter アプリに Firebase を追加する を参考に実装します。 Firebaseは、OSに依存する機能を使用するので、各プラットフォームごとに実装する必要があります。

iOS アプリを構成する

iOS アプリを構成方法 を確認しながら設定します。

  1. バンドル ID を Firebaseコンソール に設定します。
  2. Firebase iOS 構成ファイル（GoogleService-Info.plist）を取得します。
  3. ファイルを Flutter アプリの Runner/Runner ディレクトリに移動します。

Android アプリを構成する

Android アプリを構成 を確認しながら設定します。

  1. パッケージ名 を Firebaseコンソール に設定します。
  2. Firebase Android 構成ファイル（google-services.json）を取得します。
  3. ファイルを Flutter アプリの android/app ディレクトリに移動します。
  4. Gradle ファイルに設定を追記して、 flutter packages get を実行します。
buildscript {

  repositories {
    // Check that you have the following line (if not, add it):
    google()  // Google's Maven repository
  }

  // ...
  dependencies {
    // ...

    // Add the following line:
    classpath 'com.google.gms:google-services:4.3.3'  // Google Services plugin
  }
}
allprojects {
  // ...

  repositories {
    // Check that you have following line (if not, add it):
    google()  // Google's Maven repository
    // ...
  }
}
dependencies {
  // ...
}

// ...

// Add the following line to the bottom of the file:
apply plugin: 'com.google.gms.google-services'  // Google Play services Gradle plugin

FlutterFire プラグインを追加する

FlutterFire プラグインを追加する を確認しながら設定します。 以前書いた記事の FlutterやDartのパッケージを使用する にプラグインの追加方法は記載してます。

  1. Flutter アプリのルート ディレクトリから、pubspec.yaml ファイルを開きます。
  2. Firebase Core SDK を pubspec.yaml に追記します。
dependencies:
  flutter:
    sdk: flutter
  firebase_core: ^0.4.4+3  # add dependency for Firebase Core

特定の Firebase プロダクトを使用するためには FlutterFire プラグイン を追加します。

まとめ

今回は Flutterプロジェクト に Firebase の設定を行いました。 また別で、「アプリのアクセス/クラッシュ解析」や「クロスプラットフォームでPUSH通知」や「ログイン認証」などの実装を、今後まとめていきます。