Next.js 14 full tutorial 2024. Next.js 14 full-stack app project using app router, server actions, MongoDB, Auth.js. Learn Next.js in 2024.
GET NOTIFIED ABOUT UPCOMING REACT/NEXT.JS MASTER COURSE
https://list.lama.dev
SHARE YOUR COURSE EXPECTATIONS
https://docs.google.com/forms/d/e/1FAIpQLSe8vq78Nwjp4eaZzjFTwE3-EIqI-wjIN2qlgYcU6MmXkSUNuw/viewform?usp=sf_link
Source Code:
Starter: https://github.com/safak/next14-starter
Completed: https://github.com/safak/next14-tutorial
Join Lama Dev groups
X: https://x.com/lamawebdev
Instagram: https://www.instagram.com/lamawebdev
Facebook: https://www.facebook.com/groups/lamadev
Discord: https://discord.gg/yKremu4mPr
00:00 Introduction
03:00 Next.js Installation
07:31 Next.js 14 Folder Structure
09:35 Next.js App Route Explained (Next.js Routing)
18:50 Next.js Layouts Explained
21:31 Next.js Should You Use the src Directory?
23:00 Next.js Components
28:00 Next.js Loading, Error, Not Found Layouts
32:00 Next.js Styling (CSS Modules and Tailwind)
42:51 Next.js How to Give the Active Class to a Navbar Link
50:45 Responsive Navbar Design
57:30 Responsive Container Layout
59:30 Next.js Image Explained
01:07:25 Homepage Design
01:16:32 About Page Design
01:21:05 Contact Page Design
01:26:00 Next.js Blog Page Design
01:34:50 Single Blog Page Design
01:48:35 Next.js Rendering Explained (Server Components vs Client Components)
01:58:20 Next.js 14 Hydration Error and the Solutions
02:04:39 Next.js Client Component Parent & Server Component Child Problem
02:07:55 Next.js Navigation Explained (Links, useRouter, useParams, page params)
02:17:26 Next.js Data Fetching Explained (Understanding Caching)
02:24:58 Next.js Suspense Explained
02:30:04 Next.js 14 How to Fetch Data without Using an API
02:35:15 Next.js 14 MongoDB Full Stack App Tutorial
02:59:30 Next.js 14 noStore Explained (How to Stop Caching Data?)
03:00:50 Next.js SEO Tutorial (Static and Dynamic SEO Explained)
03:05:57 Next.js 14 Server Actions Tutorial with a Real-World Example
03:18:30 Next.js Server Actions vs API Routes (Which One to Choose?)
03:19:27 Next.js 14 API Route Explained
03:28:20 Next.js 14 Auth Tutorial | Authentication with Next-Auth & Server Actions
03:29:26 Next Auth Social Media Sign in Tutorial with Server Actions
03:42:07 Next Auth Social Media Sign in How to Add User To Database
03:49:47 Next Auth with User Credentials Tutorial (Email & Password Login)
04:04:20 Next.js useFormState Hook Explained!
04:17:56 Next.js 14 NEXT_REDIRECT Error and the Solution
04:19:40 Next.js 14 Middleware Explained | Next.js Auth.js (Next-Auth) How to Protect Routes?
04:33:11 Next.js 14 Admin Dashboard Tutorial with Server Actions
04:55:14 Outro