From the course: Next.js Ecommerce: Build a Shopping Platform from Scratch

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Deal countdown component

Deal countdown component - Next.js Tutorial

From the course: Next.js Ecommerce: Build a Shopping Platform from Scratch

Start my 1-month free trial Buy for my team

Deal countdown component

“

Okay, so there's one more component I want to add on the homepage, and that's going to be a deal countdown, and I'm sure most of you guys have seen this on shopping websites where it says like five days until this deal is up, or whatever it might be. Okay, so we're going to have that displayed down above the icons here, and it's going to obviously need some JavaScript, we're going to use set interval for the timer, and we're going to have some state, so it's not going to be just a static component like that one. So let's go into the components folder and I'm going to put it right in there and we're going to call it deal, so deal-countdown and we'll call the component deal-countdown and this is going to be a client component so we want to add at the top here use client and then we're going to return for now just some text, doesn't really matter what and And then I'm going to add it to the home page, which is app, root, and then page TSX. So we're going to import dlCountdown, and I'm…

Contents