Hands-On Introduction to Web Development with Next.js

Welcome to Hands-On Introduction to Web Development with Next.js — a practical and beginner-friendly course designed to get you building modern web applications from scratch using the latest features of Next.js and React.

I’m Lucas, a tech lead working in an international team. If you’ve taken any of my other hands-on courses — like React, NestJS, MongoDB, or Docker — you already know the drill: no slides, no fluff, just clean, structured, real-world coding.

In this course, you’ll start by learning the React fundamentals like JSX, props, useState, and useEffect, and then move on to building with the Next.js App Router — learning how routing, layouts, metadata, server vs client components, and data fetching work together in a modern React framework.

Along the way, you’ll also learn how to:

• Handle loading and error states with built-in file-based conventions
• Create your own simple API routes
• Understand what npm run build really does behind the scenes

We’re using Material UI instead of Tailwind, and keeping the focus on building simple UI and clean structure — with no database or deployment required.

By the end, you’ll have a clear picture of how to structure fullstack-ready apps with Next.js, and what steps to take next.

Let’s get coding!