WIL : 23.09.06

23.08.30 - 23.09.06 / BucketList : Firebase Study, 포트폴리오, TypeScript Study

🚨 trouble shooting

1️⃣ 주소값에 임의로 생성된 난수 id값을 끌어오지 못함

⭐️ SOLVE?

// 변경 전
const SubmitBucketHandler = async (e: React.FormEvent) => {
    e.preventDefault();
    if (titleRef.current) {
      const docRef = await addDoc(listRef, {
        id: bucketId,
        title: titleRef.current?.value,
        completed: false,
        category: category,
      });
      if (titleRef.current) {
        titleRef.current.value = "";
      }
    }
  };

// 변경 후
const SubmitBucketHandler = async (e: React.FormEvent) => {
    e.preventDefault();
    if (titleRef.current) {
      const docRef = await setDoc(
        doc(db, `user/${currentUser?.uid}/list`, bucketId),
        {
          id: bucketId,
          title: titleRef.current?.value,
          completed: false,
          category: category,
        }
      );
      console.log(docRef);

      if (titleRef.current) {
        titleRef.current.value = "";
      }
    }
  };

🤷‍♀️ WHY?
addDoc -> setDoc사용
addDoc의 경우 컬렉션의 주소에 대한 값이 자동적으로 난수로 발생하게 되며 setDoc의 경우 내가 사용하고자 하는 id값으로 지정가능

2️⃣ 전체 user에 대한 데이터 Reading Error.

⭐️ SOLVE?
1. database rule 수정

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {

    // 규칙 1: "user" 컬렉션의 모든 문서에 대한 읽기 권한 허용
    match /user/{userId} {
      allow read: if true;
    }

    // 규칙 2: "user" 컬렉션 아래의 "list" 서브컬렉션에 대한 읽기 권한 허용
    match /user/{userId}/list/{document=**} {
      allow write,  read: if true;
    }

    // 규칙 3: "AllList" 컬렉션의 모든 문서에 대한 읽기 권한 허용
    match /AllList/{AllListId} {
      allow write, read: if true;
    }

  }
}

2. user/{userId}/list 하위로 bucketlist값을 저장하던 테이블 이외에 모든 데이터를 불러오기 위해 submit할때, 해당 title, category, id값을 AllList라는 곳에 추가로 저장.
   id값을 함께 불러옴으로써 저장, 삭제가 동시에 가능

🤷‍♀️ WHY?
기본 rule이면 된다 생각했는데, 기본 rule의 경우 read, write가 모두 false였다.
또한 Auth에 대한 설정이 이미 모두 끝난 상황으로 data의 접근에 대한 Auth설정에 대한 코드를 변경하기엔 어려운 상황이었으므로 전체 데이터에 대한 테이블을 추가하는 방식으로 수정.

회고

처음 사용해보는 firebase가 간단한듯 어려웠고,
기존에 방대하게 있는 자료들의 경우 v8에 대한 자료라 v9를 사용하고 있는 나로써는 v8을 읽고 이해 후 v9로 다시 바꿔 생각해야하다보니 그 점이 시간이 걸렸던 것 같다.
하지만 한번 이해하고 나니 goolge auth나 data관리가 비교적 간단하고 한번에 해결되다보니 편리하게 느껴졌다.
firebase google 로그인이 워낙 많이 사용되어서 사용하고자 했던목표를 이룬 것 같고, firebase 문법에 대한 정리는 추가로 진행해야겠다.