Navigating

Query String 받아오기

인터셉팅 라우트 (Intercepting Routes)

SSR로 AuthContext 파악하기

환경변수 유의사항

Next.js API Route로 백엔드 API 엔드포인트 생성하기

파비콘 설정하기

Image 더 최적화하기

Page Router


기본 구조

동적 경로 설정하기

병렬 페이지

경로 받아오기, Context 매개변수 - SSR, SSG, ISR

Link, useRouter()로 경로 이동하기

Data Fetching

404 페이지

모든 fetch 로그로 확인하기

fallback 옵션으로 동적페이지 렌더링 제어하기

Page Router의 장단점

App Router


기본 구조

URL 정보 가져오기

useRouter() 로 경로 이동하기

Data Fetching

직렬화, RSC payload

공통 레이아웃 설정하기

Client Component, Server Component

Client Component 자식으로 Server Component 갖기

Suspense - SSG 페이지에서 Dynamic 컴포넌트 분리하기

동적 경로를 Static 페이지로 만들기

강제로 Static, Dynamic 설정하기

에러 핸들링

useParams, useSearchParams

searchParams 와 아래 방식 차이?

export default function SearchPage({
  params,
}: {
  params: { keyword: string };
}) {
  const category = params.keyword;