# Next.js

URL: https://softwaredictionary.org/terms/nextjs
Category: Web Development
Last updated: 2026-10-03
Pronunciation: NEKST jay-ES

In short: Next.js is a React framework that adds routing, server-side rendering, static generation and server code, so a whole web app can be built as one project.

## What is Next.js?

Next.js was released in 2016 by the company now called Vercel, to fill the gaps React leaves open. React renders components, but a real site also needs pages and URLs, data loading, server rendering for speed and search engines, and a build setup. Next.js provides all of these with sensible defaults, so a new project starts with one command.

Routing is based on files: in the App Router, a folder such as `app/blog/[slug]` with a `page.tsx` file becomes the page at `/blog/some-post`. Components are React Server Components by default, which run on the server, can read a database directly and send only HTML to the browser; components that need interactivity are marked with `"use client"`.

Each page can be rendered in the way that suits it: generated once at build time (SSG), rendered on every request (SSR), or regenerated in the background after a set time. Route handlers and server actions let the same project serve APIs and handle form submissions, and the framework also optimizes images, fonts and scripts.

A common misconception is that Next.js only runs on Vercel. It is open source and runs on any Node.js server, in a Docker container or as a static export for many sites, although some features fit Vercel's platform most naturally. It is not a replacement for React either; it is built on top of it.

## Key takeaways

- Next.js is a React framework for full web applications.
- Folders and files in the app directory define the routes.
- Server Components run on the server; client components add interactivity.
- Pages can be static (SSG), rendered per request (SSR) or regenerated over time.
- It is open source and runs on any Node.js host, not only on Vercel.

## Example: A page that loads data on the server (app/posts/page.tsx)

```tsx
// A Server Component: runs on the server, sends only HTML
export default async function PostsPage() {
  const res = await fetch("https://api.example.com/posts");
  const posts: { id: number; title: string }[] = await res.json();

  return (
    <ul>
      {posts.map((post) => (
        <li key={post.id}>{post.title}</li>
      ))}
    </ul>
  );
}
```

## Frequently asked questions

**What is the difference between React and Next.js?**

React is a library for building user interfaces from components. Next.js is a framework built on React that adds routing, server rendering, static generation, data loading and a build setup.

**Is Next.js frontend or backend?**

Both. It renders the user interface, but its Server Components, route handlers and server actions run on the server, so one Next.js project can contain the frontend and the backend logic.

**Do you need Vercel to use Next.js?**

No. Next.js is open source and can run on any server that runs Node.js, in Docker, or as a static export. Vercel, the company behind it, offers hosting that supports its features out of the box.

---

Software Dictionary: https://softwaredictionary.org/ · https://softwaredictionary.org/llms.txt