[Firebase] Cloud Firestore에서 query로 데이터 가져오기 (query, getDocs, docs)

query

Cloud Firestore에서 query 함수는 데이터베이스에 대한 쿼리를 생성하는 메서드이다. 이 함수를 사용하여 데이터베이스에서 특정 조건을 가진 데이터를 검색하거나 정렬할 수 있다.
매개변수로는 쿼리를 수행할 collection이 있고 추가적으로 쿼리 조건을 지정하는 함수들이 있다.

const postsQuery=query(
            collection(db,"posts"),
            orderBy("createdAt","desc")
        );

"posts"라는 collection에 쿼리를 수행할거기 때문에 참조한 collection을 첫번째 인자로 넣어주고 collection을 참조하고(이게 무슨말인지 모르겠면 collection 게시글 참고하기!) 나는 데이터를 최신순으로 정렬하기 위한 조건을 지정해줬다.

getDocs

getDocs 함수는 Firestore 데이터베이스에서 쿼리를 실행하여 해당 쿼리에 일치하는 document들을 가져오는 비동기 함수이다. 즉, 미리 짜진 쿼리에 맞는 데이터를 모두 가져오기만 하는 함수라고 이해하면 된다.

const snapshot=await getDocs(postsQuery);

앞에서 생성해둔 query인 postsQuery를 getDocs에 인자로 넣어주기만 하면 query를 만족하는 collection안의 데이터를 가져온다.

이제 가져온 데이터를 어떻게 잘 정리해서 저장하는지 알아보자

docs

docs는 Firestore에서 getDocs를 통해 가져온 QuerySnapshot 객체를 다루는데 사용되는 여러 메서드 중 하나로, QuerySnapshot에 포함된 문서들을 배열 형태로 반환한다.
추가적으로 각 document에 대한 데이터는 doc.data()를 사용하여 접근하고, 문서의 ID는 doc.id를 사용하여 접근한다.

const posts=snapshot.docs.map(doc=>{
            const {post,createdAt,userId,username,photo}=doc.data();
            return{
                post,createdAt,userId,username,photo,id:doc.id,
            }
        });

docs를 이용해 QuerySnapshot 객체를 배열로 반환하고 doc.data()로 배열 안의 각 요소의 데이터에 접근하여 원하는 변수에 각각 할당한다.

참고
[노마드코더] https://nomadcoders.co/nwitter/lectures/4529