火星生技 MARX Biotech
全端客製化網站・CMS 架構・Nuxt3 + PHP
為火星生技 MARX Biotech 開發企業官方網站，
採用 Nuxt3 + PHP 前後端分離架構，並建置專屬 CMS 後台。
專案從中文版開始，後續擴充英文版，
再陸續新增集團子品牌獨立介紹頁，以及企業永續頁面。
同時串接即時股價 API、表單寄信功能，並實作 Three.js 主視覺與全站動畫效果。
專案自 2023 年 9 月啟動，持續開發與維運至 2026 年 5 月維運合約結束。
挑戰與解法
// 根據實際業務需求，完成企業級雙語官網與專屬 CMS 系統。
01開發企業級雙語官網，並建置專屬 CMS 後台
從零規劃並開發完整前後端系統，並針對部分內容提供後台管理功能，讓品牌能自主更新重要資訊。
02串接即時股價 API，動態計算公司市值
整合政府提供的證交所 API，即時取得數據進行計算，並依雙語環境自動格式化顯示公司市值。
03串接第三方 API，實現聯絡表單寄信功能
將前台表單資料透過 API 發送至指定信箱，確保訊息即時送達並提升使用者體驗。
04前後端分離架構，長期合作持續擴充維護
採用 Nuxt3 + PHP 前後端分離，方便後續功能擴充與維護，維持系統穩定性。
05客製 CSS 動畫與全站 AOS 入場效果
根據品牌視覺風格，設計並實作全站滾動入場動畫，提升網站質感與互動體驗。
頁面展示
Home
// 使用 Three.js 實作 3D 主視覺，並以 CSS + JS 完成品牌 LOGO 於滾動時淡入淡出等動態效果。
About
// 主視覺採用影片背景，支援中英雙語標題切換；內文區塊元件化，方便全站重複使用。
Brands
// 中英雙語分別開發不同版型架構，以符合各語言的閱讀習慣與資訊呈現。
Brands Details
// 客製化品牌介紹子頁面，用來呈現集團旗下各子品牌內容。
Investor
// 開發簡易公告與營收管理功能，供品牌方自行更新；串接證交所 API 取得每日股價進行計算，並依中英文自動格式化呈現。
Sustainability
// 依品牌需求額外建置中文企業永續頁面，並重新調整資訊架構，將投資人專區部分內容整合至此。
To the Marx
// 串接第三方 API 以將表單填寫內容自動發送郵件至品牌方指定信箱。
