Frameworks
Next.js icon

Next.js

The default choice for most new React projects, with file-based routing, server rendering, and API routes built in. If you're not sure what to reach for, reach for this.

What is Next.js?

Next.js is a React framework that handles routing, rendering, and backend logic in one project instead of stitching together a separate router, build tool, and API server. It supports server-side rendering, static generation, and API routes out of the box, and its App Router model pushes React Server Components as the default, which shifts more rendering work off the client. It's built and maintained by Vercel, and deploying to Vercel is the most turnkey path, though it isn't required.

Key features

  • File-based routing, including nested layouts, loading states, and route groups
  • Server Components by default in the App Router, reducing the amount of JavaScript shipped to the browser
  • Built-in API routes and server actions, so a lot of backend logic doesn't need a separate service
  • Image, font, and script optimization handled automatically rather than configured by hand
  • Large ecosystem of docs, examples, and third-party tooling, since it's the most widely used React framework

Who it's for

Most new React projects, from a marketing site to a full SaaS app, since it covers routing, rendering, and API needs without extra setup. A team wanting a pure client-side single-page app with no server rendering at all may find a lighter tool (plain Vite plus React Router) is simpler for that specific case.

Pricing

Free and open source. Hosting cost depends on where it's deployed. Vercel (the framework's maintainer) has a free tier with usage-based paid plans; self-hosting elsewhere is also fully supported.