使用 VS Code 製作靜態形象網站，並部署到 GitHub Pages（新手完整教學）
前言｜為什麼選擇 GitHub Pages？ 對工程師來說，擁有一個「可公開存取的個人形象網站」已經是基本配備，例如： 個人介紹 技術背景 專案作品集 GitHub / 聯絡方式 GitHub Pages 是一個非常適合新手與工程師的選擇，原因包括： 免費 不需要主機 支援純靜態網站（HTML / CSS / JS） 與 Git 版本控制整合 本篇文章將從 0 開始 ，一步一步帶你完成： 本機開發 → GitHub 上傳 → GitHub Pages 上線 一、環境準備 必要工具 請先確認你電腦中已安裝： VS Code Git GitHub 帳號 確認 Git 是否安裝成功 在 Windows 開啟「命令提示字元」或「PowerShell」： git --version 有顯示版本號代表安裝成功。 二、建立靜態網站專案結構 建立專案資料夾 建立一個資料夾，例如： my -profile-website 用 VS Code 開啟該資料夾後，建立以下結構： my-profile-website/ │ ├─ index .html ├─ css/ │ └─ style .css ├─ js/ │ └─ main .js └─ images/ ⚠️ index.html 一定要放在根目錄，GitHub Pages 才找得到 三、撰寫基本網站內容 index.html <!DOCTYPE html > < html lang = "zh-TW" > < head > < meta charset = "UTF-8" /> < title >Jeff Chen｜個人形象網站 </ title > < link rel = "stylesheet" href = "css/style.css" /> </ head > < body > < header > < h1 >xxxx </ h1 > < ...
