firebase deleteDoc 사용법

• 먼저 SDK 라이브러리 import

• Firebase db에 넣을 때 : 버튼이 클릭되면 어떤 데이터를 삭제할건지 식별값이 필요

  Firebase에서는 doc.id 라는 내장 변수를 제공한다. doc.id는 Firebase에서 각 문서에 자동으로 부여하는 고유 id 값이다. 각 문서 객체에는 id라는 속성이 자동으로 포함된다. (조회, 수정, 삭제 시 사용)

        let cardId = 1;
        let docs = await getDocs(collection(db, "movies"));
        docs.forEach((doc) => {
            let row = doc.data();
            let image = row['image'];
            let title = row['title'];
            let rank = row['rank'];
            let comment = row['comment'];

            let temp_html = `
            <div id='movieCard-${cardId}' class="col" data-id="${doc.id}">
                <div class="card h-100">
                    <img src="${image}" class="card-img-top" alt="...">
                    <div class="card-body">
                        <h5 class="card-title">${title}</h5>
                        <p class="card-text">${rank}</p>
                        <p class="card-text">${comment}</p>
                    </div>
                    <button type="button" class="deleteBtn btn btn-danger">삭제</button>
                </div>
            </div>
            `;
            $('#cards').append(temp_html);
        });

• 삭제 이벤트 함수 구현
  closest
  특정 요소에서 지정한 셀렉터와 일치하는 가장 가까운 요소를 찾는다.
  deleteDoc(doc(db, "컬렉션이름", "삭제하려는 문서의 ID"));
  컬렉션에서 문서의 id로 문서를 찾아서 삭제한다

        $('#cards').on(`click`, `.deleteBtn`, async function () {
            // 버튼이 속한 카드의 data-id 속성에서 Firebase 문서 ID 추출
            const docId = $(this).closest('.col').data('id');

            // Firebase에서 문서 삭제
            try {
                await deleteDoc(doc(db, "movies", docId));
                alert("삭제 완료!");
                window.location.reload();
            } catch (error) {
                console.error("문서 삭제 오류:", error);
            }
        });