今天要完成的目標是：把自己的網頁架設到 GitHub Pages，讓任何人都能透過網址看到我的作品。這對於日後展示專案、作品集或作業都非常方便。

為什麼要用 GitHub Pages

• 免費：不用額外租網頁空間
• 方便：直接從 GitHub 倉庫部署
• 版本控制：每次更新網頁只要 push 就能自動更新
• 公開展示：可以分享網址給老師或朋友

步驟整理

1. 建立 GitHub 倉庫

• 登入 GitHub，點擊 New Repository
• 輸入名稱（例如 mysocks），設定為 Public
• 初始化 README（可選）

2. 將網頁專案 push 到 GitHub

• 在電腦上開啟專案資料夾
• 打開終端機或 Git Bash，初始化 git：

git init
git add .
git commit -m "第一次上傳網頁專案"

• 將本地專案連結到 GitHub 倉庫：

git remote add origin <你的倉庫網址>
git branch -M main
git push -u origin main

3. 啟用 GitHub Pages

• 到 GitHub 倉庫頁面，點擊 Settings → Pages
• 在「Source」欄位選擇：
  • Branch：main
  • Folder：/ (root)
• 點下 Save
• 儲存後 GitHub 會生成一個網址，例如：https://username.github.io/mysocks/

4.檢查網頁

• 打開 GitHub Pages 提供的網址
• 確認首頁、About、歌詞頁面都能正常顯示
• 若有資源路徑問題，檢查 CSS、JS、圖片路徑是否正確

小技巧

• 相對路徑：為了 GitHub Pages 正確讀取資源，圖片、CSS、JS 使用相對路徑 (./images/xxx.png) 比較保險
• 自動部署：以後更新內容，只要 commit + push 就會自動更新網頁

透過今天的實作，我成功把這次鐵人賽製作的專案架設在 GitHub 上，隨時可以分享給老師或朋友看，也對未來 web 專案的部署有了實戰經驗。
以下為此次鐵人賽實作成果，可點及連結查看:
https://enya-en.github.io/keshi-fan-website/