Adobe Hyvä Technical Implementation with Magento 2

Prerequisites:

• 具备Magento 2前端和后端开发经验
• 了解HTML、CSS、JavaScript和PHP
• 熟悉模板引擎和Magento主题架构

受众

• 过渡到Hyvä Themes的Magento开发者
• 从事Adobe Commerce店面开发的前端开发者
• 优化Magento 2性能和用户体验的技术架构师

Overview:

Adobe Hyvä 是一個現代的Magento 2前端框架，以性能為導向，開發者友好的架構取代了Luma堆棧。

這是一個由講師指導的培訓（線上或線下），旨在幫助中高級Magento開發者在Adobe Commerce（Magento 2）專案中實現和自訂Hyvä Themes。

在培訓結束時，參與者將能夠：

• 了解Hyvä Themes的架構和優勢。
• 安裝和配置基於Hyvä的Magento 2商店。
• 使用Alpine.js和Tailwind CSS自訂模板、樣式和佈局。
• 整合第三方模組並確保與Hyvä的兼容性。
• 使用Hyvä的精簡前端堆棧優化性能和用戶體驗。

課程形式

• 互動式講座和討論
• 動手練習和實驗
• 即時開發環境實現

課程定制選項

• 如需定制此課程的培訓，請聯繫我們安排。

Course Outline:

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評分
• 壓縮資源並優化交付
• 延遲加載與高級緩存策略

高級Use Case與自定義組件

• 使用Alpine.js構建可重用組件
• 使用Hyvä UI組件庫
• 表單集成與用戶輸入處理

最佳實踐與維護

• 代碼結構與模組化指南
• 保持Hyvä與依賴項的最新狀態
• 部署與主題版本控制

總結與下一步

• 關鍵概念回顧
• 準備生產部署
• Hyvä生態系統的持續學習資源