Real Estate Website Design with Next.js: Property Platforms That Convert
Your buyer drags the map boundary to a new postcode and waits. The spinner turns. Three seconds pass — no properties load. They close the tab and open Zoopla instead. Real estate platforms lose 67% of searchers before the first result renders, and the gap isn't features — it's architecture. Rightmove processes 130 million property views monthly because search, maps, saved filters, and email alerts fire in under 800ms. Next.js delivers that speed through server components that pre-render listings, edge-cached map tiles, and incremental static regeneration that updates inventory without rebuild queues. But speed alone won't hold a buyer who can't save a commute-time polygon or calculate affordability mid-search. The platforms that convert pair sub-second interactivity with mortgage calculators, school catchment overlays, and agent dashboards that sync CRM updates in real time. This guide unpacks the data models, API patterns, and progressive enhancement strategies that separate a directory from a platform buyers return to daily.
Why Real Estate Needs Custom Web Development
The real estate industry runs on property portals. Rightmove and Zoopla in the UK, Zillow and Realtor.com in the US — these platforms handle millions of searches every single day. But the opportunity isn't reserved for the giants.
Next.js is the right framework here because property sites have a very specific set of demands that most generic setups can't handle well. Massive page counts — every listing needs its own URL for SEO. Complex search with location, price, bedrooms, property type, and dozens more filters all running simultaneously. Map integration where draw-to-search is basically expected now. Real-time data because listings go on and off market constantly. And traffic spikes that'd bring a poorly architected site to its knees.
What Zoopla Gets Right
Zoopla processes over 50 million visits per month. Think about that for a second. Their key features: instant search with location autocomplete, map/list toggle, draw on map for custom search areas, travel time search, price history, area guides with school ratings and crime stats, and saved searches with alerts. The good news? These features are absolutely achievable with modern tools. You don't need Zoopla's budget to build something that feels like Zoopla.
Core Features of a Property Platform
For Property Seekers
Property search with filters, map-based search with draw-to-search, property detail pages with gallery and floor plans, saved properties shortlist, saved searches with email alerts, mortgage calculator, area information, agent contact form, and similar properties suggestions.
For Estate Agents
Listing management dashboard, photo and floor plan upload, property status management (for sale, under offer, sold STC, sold), lead management and CRM, analytics per listing, automated email reports, and data feed integration with portals.
Most agencies get the buyer side right but completely neglect the agent experience. That's a mistake. If agents hate using your backend, they won't keep listings updated — and stale data kills trust faster than anything else.
Property Search and Filtering
Location Search
Use Google Places Autocomplete or Mapbox Search for real-time suggestions. Store neighbourhood and city boundaries as GeoJSON polygons for accurate area-based results. And maintain a postcode-to-coordinate lookup table — users expect instant postcode search, and a database round-trip to geocode every time won't cut it.
Filter System
Price range — Dual slider with preset ranges and custom values. Bedrooms — Button group with minimum support. Property type — Multi-select: Detached, Semi, Terraced, Flat, Bungalow, Land. Additional filters — Garden, parking, new build, chain free, EPC rating. Sort — Newest, price high-low, price low-high, most reduced, nearest.
Search Results
Display in list and grid views with a toggle. Include total result count, active filters as removable pills, and — this one's critical — pagination with URL state management so filtered results are shareable. Nothing's more frustrating than finding the perfect search configuration and not being able to send the link to your partner.
Interactive Maps and Map-Based Search
Use Mapbox GL JS for smooth vector tile rendering, custom styles, cluster markers, popup cards, and draw tools for polygon search. We've tried Google Maps, Leaflet, and Mapbox side by side on property projects. Mapbox wins for this use case, hands down.
Draw-to-Search
Users draw a custom polygon on the map, results filter to properties within that shape. Here's the stack: Mapbox Draw plugin, convert the polygon to GeoJSON, query PostgreSQL with PostGIS ST_Within, and store the polygon in the URL for shareability.
That last bit matters more than you'd think. People share "look at this area" links constantly.
Data Layers
Add optional overlays: price heatmap, school catchment areas, transport links with walking radius, and flood zones from environmental data. These are the features that differentiate you from yet-another-listings-site.
Property Detail Pages
Image Gallery
Full-width hero with gallery navigation, thumbnail strip, lightbox mode, floor plan view, virtual tour embed (Matterport), and street view integration. Don't skimp on image loading performance here — this is the page where people decide whether to book a viewing.
Property Information
Header — Price, address, bed/bath/reception count, type, tenure. Key features — 6-10 highlights. Description — Well-formatted agent copy. Room dimensions — Metric and imperial. EPC rating — With coloured bar chart. Council tax band and broadband speeds.
Broadband speed might seem like a minor detail. It's not. We've seen it become one of the most-viewed data points on listing pages, especially post-2020.
Location Context
Nearby schools with ratings, transport with walking times, amenities within walking distance, price comparison to area averages, crime statistics, and demographics. This contextual data is what keeps people on your site instead of bouncing to Rightmove to "check the area."
Saved Searches and Email Alerts
Users save any search configuration and receive email alerts when new properties match. Store saved searches as JSONB filter configuration — it's flexible enough to handle any combination of filters without a rigid schema. A cron job compares each saved search against new listings. Users manage alert frequency: instant, daily digest, or weekly.
This is non-negotiable for any serious property platform. Saved search alerts are your single best re-engagement channel.
Mortgage and Affordability Calculators
Mortgage Calculator
Pre-filled with property price. Inputs: deposit amount, mortgage term, interest rate. Output: monthly payment, total cost, amortization chart.
Stamp Duty Calculator
For UK sites: property price input, first-time buyer toggle, additional property surcharge, non-UK resident surcharge. These calculators serve double duty — they're genuinely useful for buyers AND they rank for high-intent search queries that drive traffic.
Affordability Calculator
Annual income, monthly outgoings, deposit available. Output: maximum borrowing, affordable property price, suggested monthly payment.
Agent Dashboards and CRM Integration
Listing Management
Add, edit, archive listings. Drag-and-drop photo reordering (agents will complain endlessly if this isn't smooth). Upload floor plans and documents. Status management workflow. Description editing.
Lead Management
Real-time inquiry feed, agent assignment, lead status tracking (new, contacted, viewing booked, offer, exchanged), automated follow-up reminders, and source attribution. That last one — source attribution — is how agents justify their spend on your platform. Don't overlook it.
Portal Integration
UK agents need BLM feed generation for Rightmove, Zoopla, and OnTheMarket. Automated feed updates when listings change. US markets use RESO standards or IDX feeds. Getting these feeds right is tedious, unglamorous work. But it's the plumbing that makes the whole system function.
Performance and SEO for Property Sites
Page Speed
Use next/image with automatic format selection, lazy load below-fold images, preload hero images, keep JS bundle under 200KB. Target: LCP under 2 seconds on mobile. Property seekers are impatient. They've got twelve tabs open. If your site feels slow, they'll close yours first.
SEO Architecture
Listing pages target "X bedroom [type] for sale in [area]". Area pages target "property for sale in [area]". Property type pages combine location and type for long-tail keywords. Guide content targets informational queries.
Structured Data
Implement RealEstateListing, Place with geo coordinates, ImageGallery, BreadcrumbList, and FAQPage schema markup.
Sitemap Strategy
Use a sitemap index with segmented sitemaps (1,000 URLs each), area pages sitemap, guides sitemap, and static pages sitemap. Set lastmod accurately — Google's paying more attention to this than ever, and incorrect lastmod values can actually hurt crawl efficiency.
Data Architecture
Database Schema
Use PostgreSQL with PostGIS. Core table: properties with coordinates, features JSONB, and full property details. Supporting tables: property_images, agents, areas (with PostGIS polygon boundaries), saved_searches (JSONB filters), and inquiries.
Look, you could use MongoDB here. But for geospatial queries at scale, PostGIS is just better. We've tried both. PostGIS wins every time.
Caching Strategy
Listing pages: ISR with 5-minute revalidation. Search results: Redis cached 60 seconds per query. Area pages: static, rebuilt daily. Images: edge-cached via CDN.
Data Feeds
Integrate with CRM systems (Reapit, Dezrez, Alto), portal feeds (Rightmove BLM, Zoopla ZPF), MLS feeds (RESO Web API for US), and Land Registry price paid data.
FAQ
How much does a real estate website cost to build?
A custom property platform with search, maps, and agent dashboard ranges from $40,000-150,000. An agency brochure site with basic listings costs $8,000-25,000. The gap's huge because the complexity difference is huge.
How do I get property data to populate the site?
For agencies: integrate with your property management CRM. For portals: negotiate data partnerships or use public data (Land Registry, EPC register).
What about virtual tours and 3D walkthroughs?
Embed Matterport or iGuide tours directly on listing pages. They handle the heavy rendering — your site just embeds the viewer. Virtual tours increase time on page by 5-10x, which is a staggering engagement boost.
Do I need a mobile app?
Most property search happens on mobile web. A progressive web app (PWA) with push notifications covers 90% of use cases without the cost of a native app. We've had this conversation with dozens of clients. The answer's almost always the same: start with PWA, build native later if the numbers justify it.
How do I handle property that sells or gets taken off market?
Never delete listing pages — they've got SEO value. Mark them as Sold and keep the page live with a banner. Add a "Similar properties" section to capture the traffic. This is one of those things that seems counterintuitive but makes a massive difference to your organic visibility over time.
What about GDPR and data protection?
Property platforms handle personal data. You'll need a privacy policy, cookie consent, data retention policy, and GDPR-compliant data processing agreements. Allow users to export and delete their data on request. Don't treat this as an afterthought — a compliance failure can shut you down.
How fast should search results load?
Under 300ms for returning results after filter changes. Use optimistic UI updates — show a loading skeleton while the query runs, then swap in results. Users don't mind a brief skeleton screen. They absolutely mind a frozen interface.