Skip to content
C Codeloom

Topics / Next.js

Next.js

Full-stack React. Routing, SSR, server components, and the App Router.

Browse 8 tutorials → Other topics

Why learn Next.js?

  • The standard for production React apps.

  • Server components solve real performance and data-loading problems.

  • First-class hosting story on Vercel, but also self-hostable.

  • One framework for frontend, API routes, and full-stack data flow.

What you can build with Next.js

E-commerce and SaaS apps Marketing sites with dynamic content Server-rendered dashboards Full-stack apps with shared TS types

Next.js tutorials

8 articles

Hand-written tutorials, ordered as a recommended learning path.

  1. 01 What Is Next.js? A clear introduction to Next.js — what it is, why it exists on top of React, what the App Router and Server Components actually do, and where it fits compared to plain React, Astro, and Remix.
  2. 02 Install & First App A practical walkthrough for installing Next.js 15 with create-next-app, understanding every file in the generated project, running the dev server, and shipping a production build.
  3. 03 App Router Basics A practical guide to the Next.js App Router — file-based routing, nested layouts, dynamic segments, client-side navigation with Link and useRouter, and the special loading and error files.
  4. 04 Server Components A practical guide to React Server Components in Next.js — what runs where, the use client boundary, how to fetch data inside components, and a first look at server actions.
  5. 05 Data Fetching A practical guide to data fetching in Next.js — async Server Components, the fetch cache, no-store and revalidate options, generateStaticParams for static routes, and server actions for mutations.
  6. 06 Metadata API Master the Next.js Metadata API with static and dynamic titles, OpenGraph tags, sitemaps, and robots.txt to ship pages that rank and share well.
  7. 07 Middleware Learn how to use Next.js middleware for authentication gates, locale routing, A/B tests, and edge logic with matcher config and runtime caveats.
  8. 08 Server Actions Use Next.js server actions to handle form submissions and mutations without API routes. Covers use server, revalidation, and security considerations.