スパルタコードクラブ-反応4週間(9)

1.Firebaseをリアクターにバインドします。

yarn add firebase

//firebase.js
import firebase from "firebase/app";
import "firebase/firestore";

const firebaseConfig = {
    // firebase 설정과 관련된 개인 정보
};

firebase.initializeApp(firebaseConfig);
// firebaseConfig 정보로 firebase 시작

const firestore = firebase.firestore();
// firebase의 firestore 인스턴스를 변수에 저장

export { firestore };
// 필요한 곳에서 사용할 수 있도록 내보내기

(2). FirebaseダッシュボードでWebボタンをクリックします.

(3). アプリケーション名を書いて、しばらく待つとsdk付加領域にテキストが表示されます.
上のFirebaseConfigの内容のみです.jsに貼り付けます.

import { firestore } from "./firebase";

const bucket = firestore.collection("buckets");
// 하나만 확인하기
    bucket
      .doc("bucket_item")
      .get()
      .then((doc) => {
        // .exists를 써서 데이터가 있는 지 없는 지 확인!
        if(doc.exists){
          // 데이터를 콘솔에 찍어보자!
          console.log(doc.data());
        }
      });
//전체 확인하기
		bucket
      .get()
      .then((docs) => {
        let bucket_data = [];
        docs.forEach((doc) => {
          // 도큐먼트 객체를 확인해보자!
          console.log(doc);
          // 도큐먼트 데이터 가져오기
          console.log(doc.data());
          // 도큐먼트 id 가져오기
          console.log(doc.id);

          if (doc.exists) {
            bucket_data = [...bucket_data, { id: doc.id, ...doc.data() }];
          }
        });

        console.log(bucket_data);