Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap
Build a Next.js Modal with Parallel & Intercepting Routes and the shadcn/ui Dialog component. In this tutorial, you will learn how Next.js Parallel & Intercepting Routes can work together to provide a modal and fallback route segment.
💖 Support me on Patreon ➜ / davegray
⭐ Become a full-stack web dev with Zero To Mastery Courses:
Complete Next.js Developer: https://bit.ly/CompNextJSDev
Advanced React: https://bit.ly/AdvReactDev
Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr
🚩 Subscribe ➜ https://bit.ly/3nGHmNn
📬 Course Updates ➜ https://courses.davegray.codes/
❓ Questions - Please post them to my Discord ➜ / discord
☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray
🔗 Source Code Example: https://github.com/gitdagray/nextjs-m...
🔗 My Next.js Videos: • Next.js Tutorials for Beginners
👇 Follow Me On Social Media:
GitHub: https://github.com/gitdagray
Twitter: / yesdavidgray
LinkedIn: / davidagray
Next.js Modal with Parallel & Intercepting Routes, shadcn/ui Dialog
(00:00) Intro
(00:14) Welcome
(00:26) Motivation
(01:13) Overview & Prerequisites
(01:57) Starter Project
(05:52) Run the project
(06:45) Adding shadcn/ui
(09:35) Component review
(11:10) Create a Parallel Route
(13:24) Create the Intercepting Route
(17:13) Create the Modal with shadcn/ui
(21:35) Applying & Viewing the Modal
(24:11) Forms in a Modal
📺 Video References:
🔗 Next.js Parallel Routes: • NextJS Parallel Routes Explained with...
🔗 Getting Started with shadcn/ui: • Build Your UI Component Library in Re...
🔗 Next.js Light & Dark Mode: • Next.js Dark Mode with No Flicker + T...
📚 Tutorial References:
🔗 Next.js: https://nextjs.org
🔗 Next.js Parallel Routes: https://nextjs.org/docs/app/building-...
🔗 Next.js Intercepting Routes: https://nextjs.org/docs/app/building-...
🔗 shadcn/ui: https://ui.shadcn.com/
🔗 shadcn/ui Dialog component: https://ui.shadcn.com/docs/components...
Was this tutorial about Next.js Modals with Parallel & Intercepting Routes and shadcn/ui helpful? If so, please share. Let me know your thoughts in the comments.
#nextjs #modal #dialog
Смотрите видео Next.js Modal with Parallel & Intercepting Routes, shadcn/ui Dialog онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Dave Gray 07 Июнь 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 26,273 раз и оно понравилось 1 тысяч людям.