Read Time:1 Minute, 30 Second

１．Firebaseプロジェクトの確認

URL: Firebase (https://console.firebase.google.com/)

目次 index【閲覧時間3分】　click !!>>

Firebaseアカウント、Firebaseプロジェクトを未だ未作成の場合、ここで作成して下さい。

→別記事｢[基礎知識]Firebaseの新規プロジェクト作成手順｣参照

２．アプリの追加

URL: Firebase (https://console.firebase.google.com/)

以下の手順でアプリの追加を行って下さい。

①アプリを追加したいプロジェクトを選択して下さい。

②「＋アプリを追加」をクリック後、表示されたウェブアイコンをクリックして下さい。

③ニックネーム、サブドメインを入力し、「アプリを登録」をクリックして下さい。
※『このアプリのFirebase Hostingも設定します』にチェックを入れるとサブドメイン設定ができます。

④必要な方は、Firebase SDK の追加を行います。
※ここでは何もせず「次へ」をクリックします。

上記記載のFirebase SDK 追加用のコード：

npm とモジュールバンドラ（webpack や Rollup など）をすでに使用している場合は、次のコマンドを実行して最新の SDK をインストールできます。（詳細）。

npm install firebasecontent_copy

次に Firebase を初期化し、使用するプロダクトの SDK の利用を開始します。

// Import the functions you need from the SDKs you need
import { initializeApp } from “firebase/app”;
import { getAnalytics } from “firebase/analytics”;
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app’s Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: “AIzaSyB69Xt0wA46U7RX42-pQK6_MDRN01YI4HU”,
authDomain: “flutter2024010601.firebaseapp.com”,
projectId: “flutter2024010601”,
storageBucket: “flutter2024010601.appspot.com”,
messagingSenderId: “304069982134”,
appId: “1:304069982134:web:dfbe5128763353fcef7317”,
measurementId: “G-KW9PNCQ60E”
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

上図に複数あるリンク内容：

注釈）
・nmp：https://www.npmjs.com/
・webpack：https://webpack.js.org/
・Rollup：https://rollupjs.org/
・詳細：DK バージョン: 名前空間方式とモジュラー・モジュラー JavaScript SDK
・使ってみる：｢Firebase を JavaScript プロジェクトに追加する｣
・ウェブ SDK API リファレンス：｢API Reference｣
・サンプル：Fireアプリ学習用サンプル(たくさんある！)

⑤必要な方は、firebase-tools の更新（もしくは新規インストール）を行います。
※firebase-toolsがインストールされているかどうかは、次のコマンドで確認できます。
　>　firebase –version　※バージョンが13以上ならばひとまずOKでしょう。
※ここでは何もせず「次へ」をクリックします。