[Firebase] Javascript에서 Google Cloud Firebase 문서(doc)로 CRUD 구현하기

CRUD : Create(생성), Read(읽기), Update(갱신), Delete(삭제)를 묶어서 일컫는 말

 

 

Create(생성)

 

1. addDoc

자동 생성 ID를 사용하여 문서를 추가하는 방법

import { doc, addDocs } from 'https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js';

await addDoc(doc(db, "컬렉션"), data);

 

2. setDoc

ID를 지정하여 문서를 추가하는 방법 (이미 중복된 ID가 있을 경우 필드가 덮어 씌워짐)

import { doc, setDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js"; 

await setDoc(doc(db, "컬렉션", ID), data);

 

 

 

 

 

 

Read(읽기)

 

1. getDoc

컬렉션의 ID라는 문서의 필드값을 가져온다. 사용할 땐 .data()로 데이터 정제 후 사용

import { doc, getDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

const doc_get = await getDoc(doc(db, "컬렉션", ID));
let doc_value = doc_get.data();

 

2. getDocs

컬렉션의 모든 문서를 가져오는 방법. foreach문과 함께 사용

import { collection, getDocs } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

const docs = await getDocs(collection(db, "컬렉션"));
docs.forEach((doc) => {
  console.log(doc.id, " => ", doc.data());
});

 

 

 

 

Update(갱신) 

 

1. updateDoc

컬렉션의 ID를 가진 문서의 필드를 수정

import { doc, updateDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

await updateDoc(doc(db, "컬렉션", ID), {
  KEY : VALUE
});

 

2. arrayUnion, arrayRemove

updateDoc을 통해 문서의 배열 필드에 접근하여 data를 추가하거나 삭제하는 방법

arrayUnion()은 배열에 없는 요소만 추가하고, arrayRemove()는 제공된 각 요소의 모든 인스턴스를 삭제함

import { doc, updateDoc, arrayUnion, arrayRemove } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

await updateDoc(doc(db, "컬렉션", ID), {
    KEY : arrayUnion(data)
});

await updateDoc(doc(db, "컬렉션", ID), {
    KEY : arrayRemove(data)
});

 

3. increment

마찬가지로 updateDoc으로 접근하여 필드의 현재 값을 value만큼 값을 증분시키는 방법

import { doc, updateDoc, increment } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

await updateDoc(doc(db, "cities", "DC"), {
    KEY : increment(VALUE)
});

 

 

 

 

 

Delete(삭제)

 

1. deleteDoc

컬렉션의 ID와 일치하는 문서를 제거

import { doc, deleteDoc } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

await deleteDoc(doc(db, "컬렉션", ID));

 

2. deleteField

ID와 일치하는 문서에 접근하여 KEY와 일치하는 필드를 제거

import { doc, updateDoc, deleteField } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";

await updateDoc(doc(db, 'cities', 'BJ'), {
    KEY : deleteField()
});

 

컬렉션은 코드로 삭제 불가함으로 관리 페이지에서 직접 삭제해줘야 한다.

 

 

 

 

 

 

 

더 다양한 빌드 참조 시

https://firebase.google.com/docs/firestore/query-data/get-data?hl=ko

Cloud Firestore로 데이터 가져오기  |  Firebase