聯繫我們

課程簡介

Hyvä 主題簡介

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

安裝與設定 Hyvä

  • 系統需求與授權條款
  • 使用 Composer 安裝 Hyvä
  • 在 Magento 2 中啟用並設定 Hyvä 主題

使用 Tailwind CSS 和 Alpine.js

  • Tailwind CSS 工具類概觀
  • 套用自訂樣式與版面配置
  • 使用 Alpine.js 建構互動式元件

模板與版面配置自訂

  • 理解 Hyvä 的模板結構
  • 擴充區塊(Blocks)與版面配置 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 效能與使用者體驗的技術架構師
 21 小時

人數


每位參與者的報價

客戶評論 (3)

即將到來的課程

課程分類