orderBy 함수를 사용하면 특정 속성으로 정렬할 수 있습니다. 이 함수의 첫 번째 파라미터는 속성 이름, 두 번째 파라미터는 'desc'(내림차순) 또는 'asc'(오름차순)입니다.

다음으로 불러오는 포스트 수를 3개로 제한해봅시다.

lib/posts.js - getPosts

export const PAGE_SIZE = 3;

export async function getPosts() {
  const snapshot = await postsCollection
    .orderBy('createdAt', 'desc')
    .limit(PAGE_SIZE)
    .get();

  const posts = snapshot.docs.map((doc) => ({
    id: doc.id,
    ...doc.data(),
  }));

  return posts;
}

현재 포스트의 수를 COUNT라는 상수로 선언해줬는데요. 이렇게 한 이유는 추후 페이지네이션을 구현하는 과정에서 함수를 두 개 더 만들면서 똑같은 값을 사용할 것이기 때문입니다. 또한, 컴포넌트에서 포스트 목록을 끝까지 불러왔는지 확인하기 위해 이 값을 참조하므로 이 값을 export해줬습니다.

포스트를 더 작성해 개수를 9개 이상으로 맞춘 다음, 앱을 리로딩해보세요. 최근 작성한 순으로 3개만 로딩됐나요?