Meet Next.js

Next.js in one sentence

Next.js is a framework built on React that adds the production layer: routing, server rendering, data fetching, and deployment tooling.

Every component you write in Next.js is a React component. Same JSX, same props, same hooks (where allowed). Nothing from the React course is wasted. Next.js simply settles the decisions React deliberately leaves open:

A page is just a component

Here is a complete Next.js page. Read it line by line:

// app/about/page.js
export default function AboutPage() {
  return <h1>About us</h1>;
}

• Line 1 (the comment) is doing real work conceptually: the file path app/about/page.js is what makes this reachable at the URL /about. No router setup, no <Route> element.
• The export default function is an ordinary React component. Next.js finds it, renders it on the server, and sends real HTML to the browser.

That is the whole trick of file-based routing, and it is the subject of Unit 2.

Why AboutPage lives at /about

Nothing in that file names the URL. The file location does it: app/about/page.js.

Next.js uses file-based routing. The folder path under app/ becomes the URL, and the page.js file inside that folder holds the component rendered there. Rename the component from AboutPage to Whatever and the URL is unchanged, because the component's name is not part of the route. There is no route configuration file to keep in sync either. Move the folder and the URL moves with it.

Learning Next.js does not retire your React knowledge

A common worry is that picking up a framework makes the underlying library obsolete. The opposite is true here.

Every Next.js page and component is a React component. JSX, props, and hooks all carry over directly from the React course, unchanged. Next.js adds a production layer around React: routing, server rendering, data fetching, deployment. It never replaces the part you already learned. If anything, your React skills get more valuable, because the framework removes the boilerplate that used to sit between you and writing components.