서버 사이드 렌더링 (SSR)

이전 절에서는 SSG로 빌드 시점에 페이지를 미리 생성하는 방법을 다뤘습니다. SSG는 매우 빠르지만 모든 서비스에 항상 맞는 해법은 아닙니다.

요청 시점 데이터 필요성, 캐시 가능성, 사용자별 응답 여부를 기준으로 SSR과 SSG를 구분합니다.

1

SSR 개념

서버 사이드 렌더링(SSR)은 사용자가 페이지를 요청할 때마다 서버에서 데이터를 가져와 페이지를 HTML로 렌더링한 후 클라이언트로 전송하는 방식입니다.

서버 사이드 렌더링(SSR)
2

App Router에서 SSR 구현하기

Next.js App Router에서는 모든 컴포넌트가 기본적으로 서버 컴포넌트로 동작하며, 이는 SSR을 구현하는 가장 자연스러운 방법입니다.

요청할 때마다
3

SSR과 SSG의 선택 기준

SSR과 SSG는 각각의 장단점이 명확하므로, 애플리케이션의 특정 요구사항에 따라 적절한 렌더링 전략을 선택해야 합니다.

하이드레이션(Hydration)