2,000+ Free Courses with Certificates: Coding, AI, SQL, and More
Google Data Analytics, IBM AI & Meta Marketing — All in One Subscription
Overview
Google, IBM & Meta Certificates — All 10,000+ Courses at 40% Off
One annual plan covers every course and certificate on Coursera. 40% off for a limited time.
Get Full Access
Learn how to create a reusable modal component in Next.js and React in this comprehensive tutorial video. Explore the differences between modals and dialogs, understand the unique considerations when building modals for Next.js versus React, and discover why managing modal state with URL parameters is preferable to using useState. Follow along as the instructor guides you through creating a dialog component, implementing it on a page, and enabling server actions in Next.js. Gain insights into the advantages of using URL parameters for state management and learn best practices for building modals in modern web applications.
Syllabus
Intro
Welcome
Lesson Goals
Starter Code Review
Creating the Dialog Component
Adding the Dialog to a page
A Big Difference between Next.js & React
Enabling Server Actions in Next.js
Viewing the differences between Modals & Dialogs
Why manage state with URL Params?
Wrap up
Taught by
Dave Gray