Next.js App Router 완전 정복: 서버 컴포넌트와 스트리밍

인 웹 애플리케이션을 구축하는 방법을 살펴보겠습니다.

서버 컴포넌트는 서버에서 렌더링되어 클라이언트로 전송되므로 번들 크기를 줄이고 초기 로딩 성능을 향상시킵니다. 데이터베이스 접근이나 API 호출을 직접 수행할 수 있어 코드가 간결해집니다.

App Router의 새로운 파일 시스템 기반 라우팅은 page.js, layout.js, loading.js, error.js 등의 특별한 파일들을 통해 더 직관적인 구조를 제공합니다. 중첩 레이아웃으로 코드 재사용성도 높아집니다.

스트리밍을 활용하면 페이지의 일부분을 먼저 보여주고 나머지 데이터가 로드되는 대로 점진적으로 업데이트할 수 있습니다. 사용자는 전체 페이지 로딩을 기다리지 않고도 콘텐츠를 확인할 수 있습니다.