pages-router

Next.js Pages Router uses getStaticProps for static generation and getServerSideProps for server-side rendering. Export these functions from your page files under the pages directory to fetch data at build time or request time.

Dynamic routes in the Next.js pages directory use file-based routing with bracket notation for dynamic segments. You can create nested folders and export getStaticPaths alongside getStaticProps to pre-render dynamic static pages.

Customize _app.tsx to persist layouts and global state across page transitions, and _document.tsx to modify the server-rendered HTML shell. These files ensure consistent rendering and global styling across all pages.

Yes, Next.js Pages Router supports API routes by creating files under the pages/api directory. This maps each file to a serverless API endpoint, allowing backend functionality within the same project structure.

Choose Next.js Pages Router for maintaining legacy Next.js projects or executing gradual migration plans. It provides established patterns for static pages, dynamic routes, and server-side rendering via exported data fetching functions.

Next.js Pages Router dynamic routes require getStaticPaths to define which paths to pre-render. If getStaticPaths is missing or does not return the correct path parameters, the dynamic route returns a 404 error.