[firebase-firestore] 실시간 컬렉션 데이터 불러오기

https://firebase.google.com/docs/firestore/query-data/listen

Cloud Firestore로 실시간 업데이트 가져오기  |  Firebase Documentation

 

 

 

Firestore document 삭제

여기서 document는 tweet이라는 document임

 

문서 삭제 관련 문서: https://firebase.google.com/docs/firestore/manage-data/delete-data#delete_documents

 

삭제 사용 코드

src/Tweet.js- 컴포넌트

import React from "react";
import { deleteSubmitTweet } from "plugins/firebase";

export default function Tweet({ tweetObj, isOwner }) {
  async function deleteTweet() {
    await deleteSubmitTweet(tweetObj.id);
  }
  
  return (
    <li>
      <p className="tweet">{tweetObj.tweet}</p>
      {isOwner ? (
        <>
          <button onClick={deleteTweet}>삭제</button>
          <button>수정</button>
        </>
      ) : null}
    </li>
  );
}

src/plugins/firebase.js - 파이어베이스 관련 통신 함수 

import { initializeApp } from "firebase/app";
import {
  getFirestore,
  collection,
  addDoc,
  getDocs,
  onSnapshot,
  doc,
  deleteDoc,
  deleteField,
} from "firebase/firestore";

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
async function deleteSubmitTweet(tweetId) {
  try {
    const fDocument = doc(db, "tweet", tweetId);
    await deleteDoc(fDocument);
  } catch (error) {
    throw new Error(error);
  }
}

export {
  // ...
  deleteSubmitTweet,
  // ...
};

 

 

문서 > 필드 업데이트하기 

Firestore 문서 필드 업데이트