Case study
Tiệm Tour
Tìm tour, lọc theo nhu cầu và yêu cầu lịch trình riêng — đặt chỗ không ma sát.
- Vai trò
- Lập trình viên Frontend
- Thời gian
- 06.2025 — 08.2025
- Công nghệ
- WordPress + NextJS · REST API · ShadCn UI
Tổng quan
Tiệm Tour là website đặt tour cho khách khám phá Hà Giang và cung đường lân cận. Khách cần tìm chuyến nhanh, lọc theo ràng buộc thật, gửi yêu cầu lịch trình riêng và thanh toán yên tâm — chủ yếu trên mobile.
Vấn đề
01Nhiều đơn vị vẫn xoay quanh inbox Facebook, spreadsheet và website brochure. Khách thoát khi không trả lời nhanh: đi đâu được, còn chỗ khi nào, đặt thế nào?
Cần trải nghiệm phía khách hiện đại, trong khi ops vẫn quản lý nội dung trên CMS quen thuộc.
Hướng tiếp cận
02- Frontend Next.js trên WordPress headless
- CPT + ACF cho tour, giá, metadata
- REST API nuôi listing/detail/filter
- Form đặt tour/inquiry + OnePay
Quyết định quan trọng
03- Ưu tiên bộ lọc thật: điểm đến, ngày, thời lượng, giá
- Flow yêu cầu tour tuỳ chỉnh riêng
- WordPress cho ops, Next.js cho khách
- Motion có kiềm chế
Tác động
Lab / shipping
LCP
1.4s
Lab mobile
Performance
96
Lighthouse
Bộ lọc live
4
Điểm đến → giá
Luồng thanh toán
1
OnePay
Kết quả
Vòng browse → lọc → đặt/yêu cầu hoàn chỉnh
Ops cập nhật tour trong WordPress không đụng frontend
Luồng thanh toán và inquiry nối follow-up admin
Pattern booking headless tái dùng được
Thư viện ảnh
Công nghệ dùng
- WordPress + NextJS
- REST API
- ShadCn UI
- Tailwind CSS
- GSAP
- Swiper