Next.js 14 App Router CRASH COURSE - Learn about Server Components and Next.js App Router
Hello guys! Welcome to the Next.js 14 App Router crash course! In this crash course we will take a deep dive into Next.js 14 app router and see how you can use the app router and the different features offered by it. We will cover things like the app router folder structure, special files, dynamic routes, RSC (React Server Components), Next.js server actions, parallel routing and more. This video aims to get you from a level where you have no idea about Next.js app router to a level where you can start building using the app router. However, if you want to dig deeper in the app router behaviors and features, feel free to dive in the Next.js documentation which is linked below in the links section.
If you liked the content and found it useful, make sure you support me by clicking the subscribe button and sharing this video with friends in need. 🤝
Links
Next.js documentation - https://nextjs.org/docs
My video on Next.js server actions - • Next.js 14 Server Actions Tutorial — ...
Timestamps
0:00 - Introduction
0:59 - Creating a Next.js app router application
1:59 - Folder structure overview
3:35 - React Server Components (RSC)
6:17 - Bonus tip - “server-only” package
9:36 - Caching in Next.js app router
17:10 - Next.js 14 server actions
20:00 - Revalidation using server actions
22:50 - Special routing files in Next.js app router
24:50 - The layout.js file
27:00 - The loading.js file
28:58 - Dynamic routing in Next.js app router
31:10 - Parallel routing
34:46 - Partial pre-rendering (experimental)
41:28 - Conclusion
Any suggestions? Leave in the comments below!
My links
E-mail - [email protected]
Blog - https://blog.atharva.codes
Latest Links - https://links.atharva.codes
Twitter - / athudeosthale
LinkedIn - / atharvadeosthale
#programming #programmer #javascript #nodejs #npm #reactjs #react #nextjs #app #pages #router #nextrouter #approuter #pagesrouter #next14 #nextjs14 #nextjstutorial