Demo Luxury Real Estate by D2D

เป็นเว็บไซต์แลนดิ้งเพจอสังหาริมทรัพย์แบบหน้าเดียว สำหรับโครงการบ้านระดับพรีเมียม ใช้เพื่อสื่อสารแบรนด์ นำเสนอแบบบ้าน บรรยากาศโครงการ จุดเด่นด้านทำเล โปรโมชั่น และการนัดชมโครงการพร้อมระบบเก็บรายชื่อลูกค้าและหน้าแอดมินเบื้องต้น

Hero

ส่วนเปิดหน้าเว็บที่สื่อภาพลักษณ์หลักของโครงการด้วยภาพลักชัวรี จุดขายสำคัญ ปุ่มกระตุ้นการตัดสินใจ และฟอร์มลงทะเบียนรับสิทธิพิเศษ

StatBar & HighlightSection

แถบสถิติที่ช่วยเพิ่มความน่าเชื่อถือของโครงการ เช่น ยอดจอง รางวัล จำนวนครอบครัวลูกบ้าน และระดับความปลอดภัย

ส่วนจุดเด่นของโครงการ เน้นคุณค่าด้านการอยู่อาศัยและฟังก์ชัน เช่น สมาร์ทโฮม ระบบความปลอดภัย รองรับรถ EV และสิ่งอำนวยความสะดวกระดับพรีเมียม

MortgageCalculator

เครื่องคำนวณสินเชื่อเบื้องต้นแบบโต้ตอบ ช่วยให้ผู้ใช้ประเมินราคาบ้าน เงินดาวน์ ดอกเบี้ย ระยะเวลากู้ และค่างวดรายเดือน

UnitsSection

ส่วนแสดงผังโครงการและแบบบ้านที่มีให้เลือก พร้อมรายละเอียดตำแหน่งทางการตลาด ขนาดบ้าน จำนวนห้องนอน/ห้องน้ำ และราคาเริ่มต้น

GallerySection

แกลเลอรีภาพที่ใช้โชว์บรรยากาศของพื้นที่สำคัญในโครงการ เช่น ห้องนั่งเล่น พื้นที่ทานอาหาร คลับเฮ้าส์ และห้องนอนใหญ่

LocationSection

ส่วนที่สื่อจุดเด่นด้านทำเลและการเดินทาง โดยอธิบายสถานที่สำคัญใกล้เคียงและมีแผนที่ฝังในหน้าเว็บ

AppointmentSection

ส่วนสำหรับนัดเข้าชมโครงการ ลูกค้าสามารถกรอกข้อมูลติดต่อ วันที่ เวลา และจำนวนผู้เข้าชมเพื่อจองนัดหมายได้

Promotion Section

ส่วนโปรโมชั่นที่เน้นข้อเสนอแบบจำกัดเวลาและสิทธิพิเศษสำหรับการจอง เพื่อเร่งการตัดสินใจของลูกค้า

Footer

ส่วนท้ายเว็บไซต์ที่สรุปแบรนด์อีกครั้ง พร้อมข้อมูลติดต่อ เวลาเปิดทำการ ช่องทางโซเชียล และช่องรับข่าวสารทางอีเมล

Click here to visit https://d2d-real-estate-luxury-demo.vercel.app/

Tech stack

• Frontend: React 19 + TypeScript

• Build tool: Vite 6

• Styling: Tailwind CSS 4

• Animation: Framer Motion และ motion

• Icons: lucide-react

• Backend entry/server: Express ผ่าน server.ts

• Database / Auth: Firebase โดยใช้ Firestore และ Firebase Auth

• Form/data handling: ฟอร์มใน React state โดย submit เข้า Firestore

• Utility libs: clsx, tailwind-merge, date-fns