From the course: Next.js 14 from Scratch: Build a Real-World Project Using Next.js 14 and MongoDB
Unlock this course with a free trial
Join today to access over 25,200 courses taught by industry experts.
Properties page - Next.js Tutorial
From the course: Next.js 14 from Scratch: Build a Real-World Project Using Next.js 14 and MongoDB
Properties page
All right, in this video, I want to start to show the properties. And I know we don't have our API routes. We don't even have our database set up, anything like that. But we're going to start off working from a JSON file. So I've included the JSON file in the download for this section. You can also find it in the final repository. And I have it right here, so properties.json. And just to kind of show you what the data looks like, and this is the same data that we'll have in our database, or I should say same structure, same fields. So there's about 10 different property listings in here. And each one has an ID. I called it underscore ID because that's the convention that Mongo uses. And then the owner, which right now is just a hard-coded number, but ultimately, that will reference a user from the user's collection. So we'll have a relationship between the two collections. Then we have a property listing name, a type, which could be apartment, condo, house, et cetera, description. And…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
(Locked)
New project and folder structure6m 13s
-
(Locked)
Layout, homepage, and metadata10m 47s
-
(Locked)
File-based routing7m 16s
-
(Locked)
Server vs. client components and router hooks9m 44s
-
(Locked)
Start on the navbar10m 3s
-
(Locked)
Navbar links, drop-downs, and React icons12m 28s
-
(Locked)
Active links and conditional rendering11m 48s
-
(Locked)
Homepage components15m 45s
-
(Locked)
Properties page7m 26s
-
(Locked)
Property card dynamic data14m 41s
-
(Locked)
Home property listings7m 42s
-
(Locked)
Custom not found and loading pages5m 58s
-
(Locked)
-
-
-
-
-
-
-
-