Next.js 16 Full Stack Course (8+ Hours) | Auth, Caching, Server Actions & Much More

Description

Next.js is one of the most powerful React frameworks available and with the release of Next.js 16, it just got even better. New features like Cache Components make apps faster and more efficient than ever. In this video, we’ll take a complete deep dive into Next.js, and you’ll learn everything from A to Z. We’ll build a full production-ready application from scratch while exploring routing, server components, authentication, data fetching, real-time updates, caching, deployment, and much more. This won’t be just a light overview, we’ll dive deep into the dynamics of Next.js while creating a powerful and fully optimized web application. 🚀 Try out Convex for FREE: https://convex.link/JanMarshall 📸 Screen Recording Software: https://dub.sh/eDa47SO 🔒 My favorite Auth Solution: https://dub.sh/xeU8r3v ⌨️ GitHub Repo: https://www.marshalcode.com/free-tutorials/nextjs-16-full-stack-course-8-hours-auth-caching-server-actions-more 🌍 My Website: https://marshalcode.com/ 👋🏻 Discord: https://discord.gg/ZzGqgpmd24 ✅ Follow me on X: https://x.com/janmarshaldev 📧 Business ONLY: jan@alenix.de Timestamps: 00:00 Intro 03:42 Next.js Overview 11:00 Project Directory Overview 15:00 Routing (Pages & Layouts) 25:00 Linking & Navigation 29:00 Dynamic Routes 36:00 Getting Started with the Navbar 44:00 Setting Up Component Library (shadcn/ui) 58:00 Route Groups 01:05:00 Continuing with Auth Pages 01:10:00 Form Validation (Zod & RHF) 01:15:00 Server Components & Client Components 01:32:00 Traditional Backend Setup 01:45:00 Setting Up Our BaaS 01:51:00 Public & Private Environments 02:00:00 Setting Up Authentication (Better Auth) 02:21:00 Creating the Login Page 02:29:00 Programmatically Redirecting Users 02:37:00 Blog Creation Route 02:49:00 Creating the Database Schema 02:55:00 Creating First Server Function (Endpoint) 03:05:00 Client-Side Mutation 03:09:00 Server Actions (Server-Side Mutations) 03:19:00 Route Handlers (API Endpoints) 03:26:00 Continuing with Server Actions (Validation, AuthZ, etc.) 03:40:00 Creating Query Server Function 03:45:00 Fetching Data on the Client Side 03:47:00 Common Misconceptions with Client Components 04:00:00 Image Optimization (Image Component) 04:17:00 Fetching Data on the Server Side (Server Components) 04:26:00 Streaming with React Suspense 04:41:00 Image Uploads (Presigned URL) 05:00:00 Serving Uploaded Images 05:06:00 Next.js Caching Deep Dive 05:20:00 Revalidating Cached Data 05:28:00 Dynamic Post ID Route 05:45:00 Realtime Comments Section 06:00:00 Accessing Params on the Client Side 06:20:00 SSR + Hydration = Reactivity 06:25:00 Metadata (Static and Dynamic) 06:50:00 Presence (Realtime) 07:09:00 Next.js Proxy (Security) 07:17:00 Multi-Layered Authorization 07:27:00 Cache Components (PPR) 07:56:00 Global Search 08:26:00 Deployment