電腦版第四步：把專案交給 GitHub，之後網站自己更新

目錄

1. 先用一句話搞懂這兩個東西
2. 事前準備
3. Step 1：叫 AI 把專案放上 GitHub（15 分鐘）
4. Step 2：把 Vercel 接上 GitHub（10 分鐘）
5. Step 3：驗收自動更新（5 分鐘）
6. 之後的日常，和兩個安心機制
7. 下一級台階

第二步我們用「拖資料夾上 Vercel」的方式上線。那招夠簡單，但用久了你會撞到三個牆：

1. **每次改一個字都要重拖一次。**改十次就拖十次，遲早懶得更新。
2. **沒有歷史紀錄。**改壞了想回到昨天的版本？沒了，昨天的版本只存在你的記憶裡。
3. **只在你這台電腦裡。**電腦壞掉或重灌，專案跟著消失。

這三個問題有一個共同解法，工程師用了二十年：GitHub + 自動部署。這篇教你把它接起來，而且你一行 Git 指令都不用背，全部叫 AI 動手。

#先用一句話搞懂這兩個東西

• GitHub：你專案的雲端保險箱，而且每一次「存檔」都留一份歷史紀錄，隨時可以翻回任何一版。
• Vercel 接 GitHub：把保險箱跟網站接起來。之後你每存一次檔上去，網站一分鐘內自動更新成新版。

接好之後你的日常只剩一句話：改完東西，跟 Claude Code 說「存檔上傳」。結束。

#事前準備

• 一個網站類的專案資料夾。最順的就是第二步做的那個服務介紹頁，這篇全程拿它當例子。（第三步做的 Threads 點子腳本是命令列工具，不是網站，不適合放 Vercel，先放著沒關係。）
• 你已經照 Claude Code 實戰教學 裝好 Claude Code。還在用 Antigravity 也行，下面每一句「跟 Claude Code 說」改成在 Antigravity 管理面板說，流程一模一樣。
• 一個 GitHub 帳號：去 github.com 註冊，免費。流程是英文的：填 email、密碼，然後幫自己取一個英文帳號名（username，之後會出現在你的專案網址裡，取短一點的），中間會有一個防機器人的小遊戲。任何一步看不懂，照老規矩：截圖問 AI。

#Step 1：叫 AI 把專案放上 GitHub（15 分鐘）

在專案資料夾裡開終端機、打 claude，然後說：

幫我把這個專案放上 GitHub。我的 GitHub 帳號是 ○○○，設成私人（private）。我不會 Git，每一步做之前先用白話解釋你要做什麼、為什麼。

接下來它會處理所有髒活：初始化、第一次存檔、建立遠端倉庫、上傳。過程中有兩種它會停下來找你的情況：

• 電腦還沒裝 Git 或 GitHub 的工具：它會告訴你怎麼裝，或直接幫你裝。照著走。
• 跳出 GitHub 授權視窗（瀏覽器登入或一組代碼）：這是 GitHub 在確認「真的是你本人」。登入、輸入代碼，回到終端機繼續。

做完之後，打開 github.com/你的帳號，你會看到你的專案躺在那裡。這一刻起，你的電腦燒掉，專案也還在。

一個先養起來的好習慣：上傳前問它一句「這個專案裡有沒有不該公開的東西，例如 API key 或密碼？有的話先處理」。我們踩過 API key 外洩七天燒掉 $127.80 的坑，這一句話就能擋掉同一類事故。

#Step 2：把 Vercel 接上 GitHub（10 分鐘）

1. 開 vercel.com 登入。這裡有個岔路，走錯會很困惑：第二步用 Google 登入過的人，這次還是用 Google 登入（改按 Continue with GitHub 會建出一個全新的空帳號，你之前的專案會像憑空消失）。登入後點右上角頭像 → Settings → Login Connections，把 GitHub 接上。第一次用 Vercel 的人才直接用 Continue with GitHub 註冊。
2. 點 Add New → Project。第一次會先跳出英文的授權頁，要你把 Vercel 安裝進你的 GitHub：選你的帳號、按綠色的 Install 同意。裝完就會看到你的 GitHub 專案列表。
3. 選那個專案，按 Import，然後 Deploy。設定通通不用動，Vercel 會自己判斷。
4. 跑完會給你網址。注意：這是一個新的網址，之前拖資料夾拿到的舊網址不會跟著更新。把新網址重新傳給你傳過的人，舊的那個專案可以在 Vercel 裡刪掉，免得以後自己都分不清哪個是真的。從現在起，這個新網址會自己更新。

#Step 3：驗收自動更新（5 分鐘）

1. 回到終端機，跟 Claude Code 說：「把首頁標題加一個 🚀，然後存檔上傳。」
2. 它改完、上傳完，等一分鐘。
3. 重新整理你的網址：🚀 出現了。

這就是之後每一次更新的全部流程：講一句話，網站自己變新。

#之後的日常，和兩個安心機制

• **「存檔上傳」就是你的口頭禪。**每完成一個有意義的改動就說一次。它背後做的事叫 commit + push，你聽得懂就聽，不想懂也完全沒關係。
• 改壞了怎麼辦：跟它說「回到上一個存檔的版本」。歷史紀錄全在，這是 GitHub 給你的後悔藥。
• Vercel 部署失敗了：Vercel 頁面會顯示紅色的 Failed。點進去把錯誤訊息整段複製，貼給 Claude Code。修這個是它的工作。

#下一級台階

現在你的專案有家、有歷史、會自己上線。你會發現新的煩躁點：每次開新對話，都要把「這個專案是幹嘛的、我是誰、我的規矩」重新講一遍。

下一篇解決它：寫一份 CLAUDE.md，讓 AI 每次開工自動記得你的專案。