Next.js 15 Crash Course | Build and Deploy a Production-Ready Full Stack App

Published: 25 October 2024
on channel: JavaScript Mastery

52,873

3.3k

🌟 The Ultimate Next.js 15 Course is now on SALE! https://jsmastery.pro/next15

In this course, you'll master Next.js, the official React framework, and learn essential concepts like routing, rendering, and full-stack features. Finally, you'll put your skills to the test by building your own enterprise-ready application, YC Directory, while optimizing performance and SEO. Get ready to impress potential employers with your new skills and real-world projects!

⭐ The app in this video uses Sanity, an API platform for structured content that pairs perfectly with Next.js: https://www.sanity.io/jsmastery

⭐ JetBrains sponsored this video to allow me to share a huge news with you... WebStorm is now free for non-commercial use: https://jb.gg/GetWebStormFree

⭐ Sentry helps us monitor the app and ensures it doesn't break: https://bit.ly/4abT6PG

📙 Ultimate NextJS 15 eBook - https://resource.jsmastery.pro/nextjs...
🎨 Pitch Startup App Figma Design - https://resource.jsmastery.pro/pitch-...

📚 Materials/References:
GitHub Repository (give it a star ⭐): https://github.com/adrianhajdin/yc_di...
README (assets & code): https://github.com/adrianhajdin/yc_di...

In this video, you'll learn:
Next.js 15 App Folder Structure
Next.js 15 Client Components vs Server Components
Next.js 15 File-based Routing (including dynamic, nested routes and route groups)
Next.js 15 page, layout, loading, and error Special Files
Next.js 15 Serverless Route Handlers (Next API, API Routes, Full Stack Apps)
Next.js 15 Metadata and Search Engine Optimization (SEO)
Multiple ways to fetch data in Next.js:
Server Side Rendering (SSR),
Static Site Generation (SSG)
Incremental Static Generation (ISR)
Partial Pre-rendering (PPR)
Authentication with NextAuth
Next.js 15 Cache
Next.js 15 Server Actions
Next.js 15 Data Fetching, Architecture
Next.js 15 Parallel and sequential data fetching
Next.js 15 unstable after

💻 Join our Discord Community:   / discord
🐦 Follow us on Twitter: https://x.com/jsmasterypro
🖼️ Follow us on Instagram:   / javascriptmastery
🔗 Follow us on LinkedIn:   / javascriptmastery

💼 Business Inquiries: [email protected]

Time Stamps 👇
00:00:00 — Intro
00:05:25 — Next.js Benefits
00:10:55 — Next.js Theory & Practical
01:02:03 — Demo of the App
01:06:58 — Setup new project
01:09:20 — Authentication with NextAuth
01:28:25 — Theming and Fonts
01:35:28 — Hero Section
01:44:15 — Search Form
01:55:30 — All Startups & Startup Card
02:12:37 — Sanity Setup
02:20:01 — Sanity Schema
02:33:03 — Fetching Data and Type Safety
02:45:05 — Cache and Live API w/ Next.js
02:52:37 — Real-time Search w/ URL Query Params
02:56:27 — Understanding Partial Pre-rendering
03:08:31 — Startup Details
03:25:58 — Sanity Write Client
03:34:57 — Author Authentication Flow
03:50:03 — Create Startup Form
04:22:52 — Server Action
04:33:50 — Performance & Bug Tracking in Next.js Apps w/ Sentry
04:43:42 — User Profile
05:02:04 — Final Feature, Parallel Fetching and Deployment