Next.js 14 Full Stack Course 2024 π
Learn Next.js 14 full-stack app development with app router, server actions, MongoDB & Auth.js in 2024. Get notified!

Lama Dev
486.6K views β’ Dec 28, 2023

About this video
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
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
Tags and Topics
Browse our collection to discover more content in these categories.
Video Information
Views
486.6K
Likes
9.3K
Duration
04:55:49
Published
Dec 28, 2023
User Reviews
4.8
(97) Related Trending Topics
LIVE TRENDSRelated trending topics. Click any trend to explore more videos.
No specific trending topics match this video yet.
Explore All Trends