聯繫我們

課程簡介

Hyvä 主題簡介

  • Hyvä 是什麼以及其開發背景
  • 與 Luma 和 PWA Studio 的比較
  • Hyvä 相容性與模組生態系

安裝與設定 Hyvä

  • 需求與授權說明
  • 使用 Composer 安裝 Hyvä
  • 在 Magento 2 中啟用並設定 Hyvä 主題

使用 Tailwind CSS 與 Alpine.js

  • Tailwind CSS 工具類別概覽
  • 套用自訂樣式與版面配置
  • 使用 Alpine.js 打造互動元件

模板與版面客製化

  • 理解 Hyvä 的模板結構
  • 延伸區塊與佈局 XML
  • 建立與覆寫 PHTML 模板

模組整合與相容性處理

  • 使用與 Hyvä 相容的模組
  • 處理不相容模組
  • 使用備援機制(Luma 或 Hyvé Checkout)

利用 Hyvé 進行前端最佳化

  • 效能基準測試與 Lighthouse 分數
  • 壓縮資產並優化傳遞效率
  • 延遲載入與進階快取策略

進階應用場景與自訂元件

  • 使用 Alpine.js 建立可重用元件
  • 使用 Hyvä UI 元件庫
  • 表單整合與使用者輸入處理

最佳實踐與維護

  • 程式碼結構與模組化指南
  • 保持 Hyvé 及其相依性為最新狀態
  • 部署與主題版本控制

摘要與下一步

  • 回顧關鍵概念
  • 準備生產環境部署
  • Hyvé 生態系中的持續學習資源

最低要求

  • 具備 Magento 2 前後端開發經驗
  • 掌握 HTML、CSS、JavaScript 與 PHP
  • 熟悉模板引擎與 Magento 主題架構

受訓對象

  • 正轉換至 Hyvä 主題的 Magento 開發者
  • 負責 Adobe Commerce 前端商店的前端開發者
  • 優化 Magento 2 效能與 UX 的技術架構師
 21 小時

客戶評論 (3)

課程分類