What is Next.js?

Next.js is React with everything you need already built in. React builds your UI. Next.js gives you the rest: pages, routing, data fetching and speed.

React alone: install a router, then wire up every page yourself.

<Route path="/about" element={<About />} />

Next.js: make a folder, get a page.

app/about/page.tsx   →   /about

Why developers love it:

• Folders are pages: no router to set up
• Fetch data in your component: just await fetch(), no useEffect
• Fast by default: pages are built on the server, so they load quickly and show up on Google
• Batteries included: links, images, loading and 404 pages are built in
• Industry standard: React's own docs recommend it for new apps

How This Course Works

You learn the building blocks first, then we build a blog together, then you build your own app.

1. Learn the blocks: each lesson solves one problem, and that solution shows you the next problem.
2. Build with me: we put every block together into a real blog that loads posts from the internet.
3. Build your own: you build a mini shop alone, with these notes as your map.

Before you start:

• Node.js 20.9 or newer
• VS Code