Firestoreを利用する

事前準備

Firebaseの初期化をinitializeApp で行います。

下記のfirebaseConfigの値は、Firebase 上のWeb アプリのfirebaseConfigにあります。

getFirestoreでFirestoreの初期化と参照を取得します。

const firebaseConfig = {
    apiKey: "******************************",
    authDomain: "test.firebaseapp.com",
    databaseURL: "https://test.firebaseio.com",
    projectId: "test",
    storageBucket: "test.appspot.com",
    messagingSenderId: "**********",
    appId: "1:**********:web:********************"
};

const firebase = initializeApp(firebaseConfig);
const db = getFirestore(firebase)

ライブラリのインポート

Firebaseの JavaScript SDKのライブラリをCDN（コンテンツ配信ネットワーク）からプロジェクトに追加します。他のインポートについては、こちらをご確認ください。

import {
  getFirestore, collection, getDocs, addDoc, updateDoc, doc, deleteDoc, serverTimestamp,
} from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-firestore.js';

import {
  initializeApp
} from "https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js";

新規作成

ドキュメントの新規作成は、addDoc()メソッドを使用します。

Cloud Firestore はデータをドキュメントに保存。ドキュメントはコレクションに保存されます。

次のコードでは、users コレクションに新しいドキュメントを作成します。

users コレクションが存在しない場合は、下記処理で新規にコレクションが作成されます。

const docRef = await addDoc(collection(db, "users"), {
    name: "monaca"
});

読み取り

コレクションからのドキュメント読み取りは、getDocs()メソッドを使用します。

users コレクションの全てのドキュメントを読み取っています。

const querySnapshot = await getDocs(collection(db, "users"));
querySnapshot.forEach((doc) => {
    console.log(`${doc.id} => ${doc.data()}`);
});

更新

ドキュメントの更新は、updateDoc()メソッドを使用します。

const docRef = doc(db, "users", docRef.id);
await updateDoc(docRef, {
    born: 2020
});

削除

ドキュメントを削除するには、 deleteDoc()メソッドを使用します。

const docRef = doc(getFirestore(), "users", docRef.id);
await deleteDoc(docRef);