Next.js App Router Fundamentals

Quick Start

Files: layout.tsx (required), page.tsx (route), loading.tsx, error.tsx, not-found.tsx, route.ts (API)

Pages → App: pages/index.tsx → app/page.tsx, pages/[id].tsx → app/[id]/page.tsx

// app/layout.tsx (REQUIRED)
export default function RootLayout({ children }: { children: React.ReactNode }) {
  return <html lang="en"><body>{children}</body></html>;
}