Next.js is a React framework created by Vercel that provides a complete toolkit for building production-ready web applications. It bundles together features that React alone does not offer out of the box, including server-side rendering, static site generation, file-based routing, and API routes. Since version 13, the recommended way to build Next.js applications is through the App Router, which uses an app/ directory and replaces the older Pages Router that relied on pages/. The App Router enables React Server Components, nested layouts, streaming, and the ability to colocate related files such as components, styles, and tests alongside the routes that use them.
The App Router uses the file system as the source of truth for routing. A route is created whenever a folder inside app/ contains a file named page.tsx. For instance, creating app/about/page.tsx exposes the path /about to visitors. This convention removes the need for an explicit routing configuration file and keeps the URL structure visually aligned with the project structure. As you build more complex applications, you can add dynamic segments, layouts, loading states, and error boundaries simply by placing the appropriate special files next to page.tsx in any folder.
To support this file-based approach, Next.js relies on several special filenames that each carry a specific role. Beyond page.tsx, files like layout.tsx, loading.tsx, error.tsx, and not-found.tsx give developers fine-grained control over the user experience at every route segment. Together, these files and the folder structure form a coherent system that lets you build everything from a simple marketing site to a complex dashboard without ever leaving the framework.