Be my desk. _firebase CRUD 정리 (feat. order by)

[ CREATE ]
addDoc - 데이터 새로추가

[ READ ]
onSnapshot - 실시간 업데이트 되는 데이터 읽어옴
getDoc - 데이터 한 번 가져옴

[ UPDATE ]
setDoc - 데이터 덮어쓰기
updateDoc -

[ DELETE ]
setDoc - 데이터 덮어쓰기

---

Create

addDoc( 참조위치 , 넣을 데이터 )

// 참조위치 : postRef / 넣을 데이터 : newPost
const postRef = collection(dbService, 'postData');
const newPost = { title: "제목", contents: "내용" }

// 상위 컬렉션 "postData" 에 추가
const postData = async () => {
  await addDoc(postRef, newPost);
};

// 랜덤 아이디 잘 들어갔는지 확인
const postData = async () => {
  const newPostData = await addDoc(postRef, newPost);
  console.log('newPostData :', newPostData.id);
};

파이어 베이스가 주는 랜덤 id 값 대신, 내가 지정하는 특정값을 id 값으로 주고 싶을 때
Be my desk. _firebase 하위 컬렉션 참조위치 쓰는 2가지 방법

---

Read

onSnapshot( 참조위치, () ⇒ {} )

// 가져온 데이터 상태관리
const [data, setData] = useState();

// 참조위치 : postRef
const postRef = collection(dbService, 'postData');

useEffect(() => {
  onSnapshot(postRef, (snapshot) => {
    const postData = snapshot.docs.map((doc) => ({
      ...doc.data(),
      id: doc.id,
    }));
    setData(postData);
  });
}, []);

---

참고

RavenJS 의 firebase 유튜브 시리즈인데 정말 유용하고 간결하다.
How to set up React with Firebase/Firestore v9