🏡

Pool Villa Town

● LIVE

Landing page ค้นหาและจองบ้านพักพูลวิลล่าพัทยา

Next.js 16TypeScriptTailwind v4shadcn/uiVercel

// ความตั้งใจ

Pool Villa Plus มีฐานข้อมูลวิลล่าพัทยา 900+ หลัง แต่ไม่มีหน้าเว็บสำหรับลูกค้าทั่วไปที่จะเข้ามาค้นหาและดูรายการบ้านพักได้ อยากสร้าง consumer-facing landing page ที่ดูดีบนมือถือ มี search ง่าย และสื่อ brand ของ Pool Villa Town ออกมาได้ตรง — ตั้งแต่ออกแบบ UI จนถึง deploy ขึ้น Vercel เองทั้งหมด

// ปัญหาที่แก้

ไม่มีหน้าเว็บ public สำหรับลูกค้าค้นหาบ้านพักพูลวิลล่า — นายหน้าต้องส่ง LINE แทน

// Architecture

architecture

poolvillatown.com
├── app/
│   ├── page.tsx          ← Hero + Search + Listing
│   ├── villa/[id]/       ← Villa detail page
│   └── layout.tsx
├── components/
│   ├── SearchBar.tsx
│   ├── VillaCard.tsx
│   └── HeroSection.tsx
└── vercel.json           → Edge CDN deploy

// ฟีเจอร์หลัก

Hero + Search Bar

ช่องค้นหาหลักบน hero section — กรองตามโซน, จำนวนผู้เข้าพัก, ช่วงราคา

Villa Listing Grid

แสดง villa cards พร้อมรูปหลัก, ราคา, จำนวนห้องนอน และ availability badge

Mobile-First Design

ออกแบบสำหรับมือถือเป็นหลัก — ลูกค้าส่วนใหญ่เข้าผ่าน LINE บนมือถือ

Brand Identity

สร้าง visual identity ของ Pool Villa Town แยกจาก Pool Villa Plus — โทนสีฟ้า-ขาว ภาพทะเลพัทยา

// Commands

dev$npm run dev

deploy$vercel --prod

// ผลลัพธ์

Live บน poolvillatown.com — เป็น consumer entry point สำหรับ Pool Villa Plus ecosystem

← ผลงานทั้งหมด เปิดเว็บไซต์ ↗