firebase チュートリアル => firebaseを使い始める

備考

Firebaseはバックエンドとしてのサービス（Baas）で、モバイルアプリの開発に非常に役立ちます。

これは、 認証とセキュリティ 、 リアルタイムデータベース＆ファイルストレージ 、解析、 プッシュ通知 、ADMODおよび多くのような多くの機能を提供他を

Android、iOS、Web、NodeJS、C ++、Java Server用の SDKを提供しています

バージョン

プラットフォームSDK	バージョン	発売日
Firebase JavaScript SDK	3.7.0	2017-03-01
Firebase C ++ SDK	3.0.0	2107-02-27
Firebase Unity SDK	3.0.0	2107-02-27
Firebase iOS SDK	3.14.0	2017-02-23
Firebase Android SDK	10.2	2017-02-15
Firebase Admin Node.js SDK	4.1.1	2017-02-14
Firebase Admin Java SDK	4.1.2	2017-02-14

AndroidプロジェクトにFirebaseを追加する

ここでは、Firebaseプロジェクトの作成とAndroidアプリとの接続に必要な手順を示します。

あなたのアプリにFirebaseを追加する

FirebaseコンソールでFirebaseプロジェクトを作成し、[ Create New Project ]をクリックします。
Androidアプリに [ Firebaseを追加]をクリックし、設定手順に従います。
プロンプトが表示されたら、 アプリのパッケージ名を入力します。
アプリで使用しているパッケージ名を入力することが重要です。 Firebaseプロジェクトにアプリを追加するときにのみ設定できます。
Authでダイナミックリンク、招待、Google Sign-Inのサポートに必要なデバッグ署名証明書SHA1を追加するには、Android Studioでプロジェクトにアクセスし、ウィンドウの右側にある「 Gradleタブをクリックし、「 Refreshボタンをクリックしてproject(root) - > Tasks - > android - > signingReport 。これにより、 RunタブにMD5とSHA1の両方が生成されます。 firebaseコンソールにSHA1をコピーします。
最後にgoogle-services.jsonファイルをダウンロードします。いつでもこのファイルをダウンロードできます。
これをまだ実行していない場合は、プロジェクトのモジュールフォルダ（通常はapp /）にコピーします。

次のステップでは、SDKを追加してFirebaseライブラリをプロジェクトに統合します。

SDKを追加する

Firebaseライブラリを自分のプロジェクトに統合するには、Android Studioプロジェクトを準備するための基本的なタスクをいくつか実行する必要があります。 Firebaseをあなたのアプリに追加する際に、すでにこれを行っているかもしれません。

ルートレベルのbuild.gradleファイルにルールを追加して、 google-servicesプラグインを追加します。

buildscript {
    // ...
    dependencies {
        // ...
        classpath 'com.google.gms:google-services:3.0.0'
    }
}

次に、モジュールのGradleファイル（通常はapp/build.gradle ）に、Gradleプラグインを有効にするために、ファイルの最後に適用プラグイン行を追加します。

apply plugin: 'com.android.application'

android {
  // ...
}

dependencies {
  // ...
  compile 'com.google.firebase:firebase-core:9.4.0'
}

// ADD THIS AT THE BOTTOM
apply plugin: 'com.google.gms.google-services'

最後のステップでは、Firebase SDKの依存関係を、Firebaseのさまざまな機能で利用できる 1つまたは複数のライブラリを使用して追加します。

Gradle Dependency Line	サービス
com.google.firebase：firebase-core：9.4.0	アナリティクス
com.google.firebase：firebase-database：9.4.0	リアルタイムデータベース
com.google.firebase：firebase-storage：9.4.0	ストレージ
com.google.firebase：firebase-crash：9.4.0	クラッシュレポート
com.google.firebase：firebase-auth：9.4.0	認証
com.google.firebase：firebase-messaging：9.4.0	クラウドメッセージング/通知
com.google.firebase：firebase-config：9.4.0	リモート設定
com.google.firebase：firebase-invites：9.4.0	招待/ダイナミックリンク
com.google.firebase：firebase-ads：9.4.0	AdMob
com.google.android.gms：play-services-appindexing：9.4.0	アプリのインデックス作成

IOSのためのFirebaseの設定

まず、firebaseダッシュボードに行き、「Create New Project」ボタンを使用して新しいプロジェクトを作成したいとします。

あなたはあなたのアプリの名前を追加するなど、私は 'クールなアプリ名'としてあなたの地域を選択し、 'プロジェクトの作成'を押して、新しいプロジェクトを作成したい

プロジェクトを作成したら、ダッシュボードであるこのページに移動します。ここからfirebaseをインストールするプラットフォームを選択する必要があります。この例ではIOSを選択します。

IOSを選択すると、IOSバンドルとアプリストアIDを尋ねる下の画像と同じポップアップが表示されます。私たちのアプリはまだアプリストアにはないので、IOSバンドルを提供する必要があります。

xcodeプロジェクトを作成した後、xcodeからバンドルIDを取得することができます。通常は、アプリケーションのバンドルIDを取得することができます。xcodeのGenralビューは、先頭の最初のフィールドになります。たとえばFirebaseのBundleフィールドは 'MauginInc.KIKOO'になります。

これを実行して「次へ」を押すと、「GoogleService-Info.plist」ファイルがダウンロードされ、xcode内でアプリのルートフォルダに移動する必要があります

ポッドを初期化し、firebaseポッドをインストールするには、ターミナルに入り、xcodeプロジェクトフォルダに移動し、firebaseの指示に従ってください。

最後に、あなたのアプリを迅速に設定して、アプリ開発をより簡単で効率的にするために、AppDelegate.swiftファイルを編集するだけで、ポップアップが表示されます。

これでIOSのxcodeプロジェクトにfirebaseがインストールされました

JavaScriptで簡単なHello World Webアプリケーションを使用してFirebaseを始める

この例では、JavaScriptを使用してWebアプリケーションでFirebaseを使い始める方法を説明します。

私たちはFirebaseデータベースにテキストの子を追加し、それをWebアプリケーション上にリアルタイムで表示します。

始めましょう。

Firebaseコンソール（ https://console.firebase.google.com）に移動し、新しいプロジェクトを作成します。プロジェクト名、国/地域を入力し、プロジェクトの作成をクリックします。

あなたのコンピュータにindex.htmlファイルを作成します。そして次のコードを追加します。

  <body>
      <p>Getting started with Firebase</p>
      <h1 id="bigOne"></h1>
      <script>
            // your firebase JavaScript code here
      </script>

  </body>

Firebase Consoleであなたのプロジェクトに行くと、これを見ることができます
次に、あなたのWebアプリケーションにAdd Firebaseをクリックします。次のポップアップが表示されますので、コピーボタンをクリックしてください

次に、 index.htmlファイルに移動し、次のようにスニペットをスクリプトセクションに追加します

  <body>

    <p>Getting started with Firebase</p>
    <h1 id="bigOne"></h1>

    <script src="https://www.gstatic.com/firebasejs/3.7.4/firebase.js"></script>
    <script>
      // Initialize Firebase
      var config = {
        apiKey: "apiKey",
        authDomain: "authDomain",
        databaseURL: "databaseURL",
        storageBucket: "storageBucket",
        messagingSenderId: "messagingSenderId"
      };
      firebase.initializeApp(config);
    </script>
  </body>

Firebase初期化コードの追加が完了しました。これでデータベースからテキスト値を取得する必要があります。

それは、次のコードを追加行うには（初期化Firebaseはすでに最後のステップで追加した。再追加しない） のindex.htmlでスクリプト内

  <script>

      // Initialize Firebase
      var config = {
        apiKey: "apiKey",
        authDomain: "authDomain",
        databaseURL: "databaseURL",
        storageBucket: "storageBucket",
        messagingSenderId: "messagingSenderId"
      };
      firebase.initializeApp(config);
  
      // getting the text value from the database
      var bigOne = document.getElementById('bigOne');
      var dbRef = firebase.database().ref().child('text');
      dbRef.on('value', snap => bigOne.innerText = snap.val());

  </script>

これで、すべてindex.htmlファイルが完成しました。そして、Firebaseコンソールでデータベースに行きましょう。
今すぐ空白と空が見えます。 テキストの子をデータベースに追加し、それに任意の値を追加できます。
今すぐADDボタンをクリックしてください。
次に、データベースのRULESセクションに進みます。
開発の目的のために、ここですべての読み込みと書き込みのクエリを有効にします。
```
  {
    "rules": {
        ".read": "true",
        ".write": "true"
      }
  }
```
ブラウザでindex.htmlを開きます
あなたのページに次のようにテキスト値が表示されます -
これで、データベースに戻ってテキストの子値を何かに変更すると、ブラウザのテキストも更新やリロードなしで変更されることがわかります。これはリアルタイムデータベースがFirebase上でどのように動作するかを示します。