PAPAYA 電腦教室
中小網大
想製作自己的網站，卻因為不熟悉程式語言而遲遲無法開始嗎？其實只要掌握合適的工具，搭配 AI 輔助，就能讓網頁製作變得更簡單！本課程以 Visual Studio Code（VS Code）為核心，透過樂團官方網站的建置案例，從軟體安裝、操作介面、檔案管理與延伸模組開始，逐步認識 HTML、CSS、JavaScript 等網頁開發基礎，並學習即時預覽、程式偵錯及 GitHub 版本管理等實用功能。最後結合 GitHub Copilot、Claude Code 等 AI 程式開發助手，示範如何透過自然語言規劃網站架構、自動生成與修改程式碼，完成網站功能測試及雲端部署，體驗 AI 協作帶來的網頁開發新方式。
一、環境設定與介面基礎
二、Markdown 文件編輯與實用小技巧
三、HTML 網頁架構與 Live Server 開發工具
四、CSS 樣式排版與美化
五、進階搜尋、取代與導覽
六、JavaScript 動態互動與程式偵錯（Debug）
七、Git 版本控制與 GitHub 雲端備份
八、AI 助理整合（GitHub Copilot & Claude Code）
透過本課程，可建立網頁開發的基礎觀念與實作能力，熟悉 VS Code 的操作環境及專案管理方式，降低初次接觸程式設計的門檻。從實際製作網站的過程中，逐步掌握網頁結構、視覺排版與動態互動的基本原理，並培養運用開發工具進行問題排查、程式修改及版本控管的能力。藉由 AI 輔助開發的實務應用，學習如何將網站需求轉化為清楚的指令，運用 AI 協助規劃功能、產生程式碼及調整設計，減少從零開始撰寫程式的負擔。即使缺乏完整的程式開發經驗，也能逐步建立與 AI 協作的實務思維，提升自主製作網站、維護內容及持續優化功能的信心與效率。
課程資訊
用 VS Code 搭配 AI 輕鬆製作網頁
猜你喜歡
醫材法規預警與生產溯源
線上課程
醫材法規預警與生產溯源
數位孿生能耗領域新運用
線上課程
數位孿生能耗領域新運用
以AloT加速提升效率
線上課程
以AloT加速提升效率
勞力密集製造業的AI應用機會
線上課程
勞力密集製造業的AI應用機會
精準行銷與會員個人化經營
線上課程
精準行銷與會員個人化經營
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程3
線上課程
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程3
62分鐘
71位同學
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程2
線上課程
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程2
39分鐘
50位同學
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程1
線上課程
企業導入AI Agent-自動化流程 銷售流程智慧化實戰課程1
71分鐘
70位同學
製造業生產管理導入AI 工具-排程、良率提升與設備管理實戰課程3
線上課程
製造業生產管理導入AI 工具-排程、良率提升與設備管理實戰課程3
64分鐘
41位同學
製造業生產管理導入AI 工具-排程、良率提升與設備管理實戰課程2
線上課程
製造業生產管理導入AI 工具-排程、良率提升與設備管理實戰課程2
63分鐘
38位同學
活動詳情：https://smelearning.sme.gov.tw/news.php?node=840