Next.js 서버 컴포넌트 실전 가이드

서버 컴포넌트란?

서버 컴포넌트는 서버에서 렌더링되고 캐시될 수 있는 새로운 패러다임의 React 컴포넌트입니다.

장점

• 번들 크기 감소
• 초기 페이지 로드 성능 향상
• 백엔드 리소스에 직접 접근

실전 활용 예제

async function BlogPosts() {
  const posts = await getPosts();
  
  return (
    <div>
      {posts.map(post => (
        <PostCard key={post.id} post={post} />
      ))}
    </div>
  );
}

서버 컴포넌트를 효과적으로 활용하는 방법을 알아봅시다.