Next.js is a React framework for building applications that can render UI on the server, in the browser, or at build time. React primarily gives you a component model, while Next.js adds application-level capabilities such as routing, rendering strategies, server-side execution, optimization, metadata handling, image optimization, and backend endpoints.

A useful mental model is: React builds components; Next.js builds applications around those components.

For example, a traditional React SPA may initially download JavaScript and then request data from an API. A Next.js application can render the initial page on the server, send HTML to the browser, and then hydrate interactive components.

Next.js is particularly useful when you need SEO-friendly pages, fast initial rendering, authenticated applications, content-heavy websites, e-commerce applications, dashboards, or a single full-stack codebase.

It is important not to think of Next.js as simply 'React with routing'. The framework controls where code executes and provides mechanisms for deciding whether work belongs on the server, browser, build process, or request lifecycle.