Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Modal in Next.js and React - Create a Dialog Component

Dave Gray via YouTube

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
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

Reviews

Start your review of Modal in Next.js and React - Create a Dialog Component

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.