感謝您提交詢問!我們的一位團隊成員將在短時間內與您聯繫。
感謝您提交預訂!我們的一位團隊成員將在短時間內與您聯繫。
課程簡介
生成式 AI 在前端開發中的介紹
- 軟體開發中的生成式 AI 是什麼?
- 工具概覽:ChatGPT、GitHub Copilot、Codeium 等
- AI 在 UI 開發中的優勢與限制
基於提示的 UI 產生
- 撰寫 HTML 結構與元件的提示
- 使用 AI 產生與修改 CSS 樣式
- 利用 AI 搭建 JavaScript 互動元素
使用生成式工具構建版面配置原型
- 建立落地頁與多區塊版面配置
- 響應式設計提示(Flexbox、Grid)
- 在 CodePen 或類似工具中預覽與測試
元件化與可重用性
- 產生可重複使用的 UI 元件(按鈕、卡片、表單)
- 借助 AI 建立元件庫與設計系統
- 在主流框架(React、Vue、Tailwind)中使用 AI
AI 輔助程式碼審查與除錯
- 使用 LLM 修復版面配置錯誤與無障礙問題
- 優化 HTML/CSS/JS 效能
- 透過 AI 提示解釋錯誤並建議修復方案
協同設計與內容產生
- 使用 AI 產生模擬內容、文案與佔位符
- 與設計師合作共同創作線框圖與樣式
- 將 AI 產生的構想匯出為可用的 HTML 範本
專案:構建由 AI 輔助的網頁應用程式
- 根據商業需求設計 UI
- 使用 AI 構建元件與互動功能
- 完善、測試並展示原型
總結與後續步驟
最低要求
- 具備 HTML、CSS 和 JavaScript 的基本知識
- 熟悉前端框架或設計系統
- 對應用 AI 加速 UI/UX 工作流程有興趣
受眾對象
- 前端開發人員
- UX 工程師
- 網頁設計師與創意技術專家
14 小時
客戶評論 (1)
我獲得了關於Python中Streamlit庫的知識,我肯定會嘗試使用它來改進我們團隊中基於R Shiny開發的apps。
Michal Maj - XL Catlin Services SE (AXA XL)
課程 - GitHub Copilot for Developers
機器翻譯