Part 6: The PDP (Property Detail Page)- Build a Real Estate Marketplace with NextJS and Payload CMS

So our Properties collection is in a good enough state to start building out the completely designed Property detail page. In this video, we add a photos field as an upload field connected to the Media collection. With that new field, along with all the other features on the detail page, I have built a very large hero-style photo gallery highlighting the property photos. I have also tweaked the CSS inside the admin panel to make managing the property photos a better experience.

---

In this series, we will be building a fictitious real estate listings marketplace with Payload CMS. I am calling it TennHomes, which is an agency that supports home buyers and sellers in the East Tennessee area. I have designed, coded, and styled the homepage but have not integrating anything deeper than that, just a static page with placeholder text. In this series, I will be taking you through step-by-step how a senior developer would normally plan a big project like this.

Hello, I'm Colyn and welcome to my channel, Learn Payload with Colyn. Here, I'm documenting my path to building and deploying my first production ready SaaS app using Payload CMS.

Project Overview Slides
https://learn-payload.nyc3.cdn.digita...

Project Repo (WIP of course)
https://github.com/LearnPayload/tenn-...

TennHomes Static Home Page
https://tenn-homes-static.vercel.app/