Next.js Modal Form w/ React-Hook-Form, ShadCN/ui Dialog, Server Actions & Validation скачать в хорошем качестве

Next.js Modal Form w/ React-Hook-Form, ShadCN/ui Dialog, Server Actions & Validation

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap Learn how to build a Next.js Modal Form with React-Hook-Form, ShadCN/ui Dialog, Server Actions & Validation, TailwindCSS, TypeScript and more. Creating a modal form that launches from a table of results is a common use case in business applications. In this NextJS tutorial, you will learn how. 🙏 Thank you to daily.dev for sponsoring this video! Stay up to date with their amazingly free curated web development platform: https://daily.dev/dave-gray 💖 Support me on Patreon ➜   / davegray   🙌 Bonus: Supporting Patreon members get the source code for my "Input With Datepicker" component that works with this Modal Form tutorial:   / patron-exclusive-106135808   ⭐ 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-f... 🔗 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 Form w/ React-Hook-Form, ShadCN/ui Dialog, Server Actions & Validation (00:00) Intro (00:17) Welcome (00:26) What's Your Story? (01:41) Next.js Modal with a Form (02:09) Prerequisites (02:35) Project Dependencies (06:09) Example App (11:56) App Components & Routing (15:45) Fetching Type-Safe Data with zod-fetch (17:39) Form Component with react-hook-form (19:30) Save Alert Confirmation Pop-up (21:35) Applying & Viewing the Modal (23:45) onSubmit Function (25:42) Next.js Server Action w/ Zod Validation (27:32) Rendering the Form with Server Action Responses 📺 Video References: 🔗 Next.js Parallel Routes:    • NextJS Parallel Routes Explained with...   🔗 Next.js Intercepting Routes & Modal:    • Next.js Modal with Parallel & Interce...   🔗 Getting Started with ShadCN/ui:    • Build Your UI Component Library in Re...   🔗 TypeScript Course:    • TypeScript Full Course for Beginners ...   📚 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... 🔗 react-hook-form: https://react-hook-form.com/ 🔗 Zod: https://zod.dev/ 🔗 zod-fetch: https://www.npmjs.com/package/zod-fetch 🔗 @hookform/resolvers: https://www.npmjs.com/package/@hookfo... Was this tutorial about Next.js Modal Forms including react-hook-form, ShadCN/ui, Server Actions and Zod Validation helpful? If so, please share. Let me know your thoughts in the comments. #nextjs #modal #form