SPA 養生按摩品牌形象官網
2024
業主是位於台北的高品質 SPA 養生會館——享天堂（Heaven Spa），提供專業按摩、美容護膚、熱蠟除毛等服務，營業時間為下午一點至午夜，主打舒適放鬆的頂級體驗。
客戶希望打造一個支援繁中與英文雙語的品牌形象官網，讓國內外客群都能方便了解服務項目與預約資訊。同時要求前端具備黑夜白晝模式，讓使用者可依偏好自由切換。
前端使用 Astro 框架開發，後端以 Filament 建構管理後台，資料透過 GraphQL API 串接前端，整體架構清晰、效能優異。網站涵蓋品牌介紹、服務項目、團隊成員、最新消息、FAQ、加入我們、異業合作等完整頁面。
完整支援繁體中文與英文雙語切換，所有頁面內容、導航、SEO meta 皆可依語系動態呈現，讓國際客戶也能輕鬆瀏覽
前端內建 Dark / Light 主題切換，使用者偏好自動儲存至 localStorage，搭配 CSS 自訂屬性實現無閃爍的主題轉場效果
後端採用 GraphQL 作為 API 協議，前端透過 query 精確取得所需資料，減少不必要的資料傳輸，提升整體效能
多組輪播元件涵蓋服務項目、團隊介紹、最新消息等區塊，支援自動播放、手勢滑動、觸控操作，提供流暢的瀏覽體驗
前端採用 Astro 框架開發，以靜態生成為主，搭配島嶼架構（Islands Architecture）只在需要互動的元件載入 JavaScript，大幅提升首屏載入速度與 SEO 表現。
網站完整支援繁體中文與英文雙語切換，包含所有頁面內容、導航選單、meta 標籤等。語系偏好會自動記憶，確保使用者回訪時維持上次的語言設定。
透過 CSS 自訂屬性搭配 localStorage 實作主題切換，使用者偏好會被記住。整個切換過程無頁面閃爍，確保視覺體驗的流暢性。
後端採用 Filament 建構內容管理後台，提供直覺的管理介面，讓業主可以自行維護服務項目、團隊成員、最新消息等網站內容。
資料層採用 GraphQL 作為 API 協議，前端可透過精確的 query 語法取得所需欄位，避免 REST API 常見的 over-fetching 問題，讓資料傳輸更加高效。
