什麼是 GitHub？工程師的雲端保險箱

如果說 Google Drive 是一般上班族用來放 Word 檔、Excel 報表和簡報的雲端硬碟，那麼 GitHub 就是專門給全世界軟體工程師用來放「程式碼」的超級雲端保險箱。

在 Vibe Coding（詠唱開發）的過程中，AI 會像發了瘋似地幫我們產出大量的程式碼檔案（像是 index.html, page.tsx, package.json, tailwind.config.js 等等）。如果我們只把它們存在自己的電腦硬碟裡，會遇到幾個極度致命的商業危機：

  1. 電腦壞了，專案就全毀了：這就像玩 RPG 遊戲打了十個小時卻忘記存檔一樣崩潰。硬碟壞掉的那一刻，你的商業點子就跟著灰飛煙滅。
  2. 無法發佈到網路上讓別人看到：現代的雲端伺服器（像是我們下一章要教的 Vercel 或是業界常用的 AWS），都需要有一個公開的雲端網址，讓伺服器去把你的程式碼「抓出來」跑。存在你家電腦裡的檔案，外面的伺服器是抓不到的。
  3. 無法跟別人合作：如果你想花錢請另一個工程師幫你加新功能，你總不能把整台電腦寄給他吧？有了 GitHub，只要丟一個網址給他，他就能下載所有程式碼。

觀念釐清：Git 與 GitHub 有什麼差別？

新手常會搞混這兩個名詞，以為它們是同一個東西。我們用一個最簡單的比喻來拆解：

  • Git (時光機相機)： Git 是一個安裝在你電腦裡的軟體程式。你可以把它想像成是一台超級相機。它負責幫你記錄程式碼每一次修改的「快照（Snapshot）」。 如果你今天不小心把網站的按鈕改壞了，導致整個網頁變成白畫面。只要你有用 Git 拍過快照，你就可以隨時搭時光機，把檔案「還原」回到昨天還沒壞掉的存檔點。

  • GitHub (線上雲端相簿)： GitHub 是一個公開的網站（目前是被微軟收購的超級大公司）。你可以把你用 Git 拍好的那些「快照」，上傳到這個線上雲端相簿裡。 這樣一來，就算你的電腦被火燒掉，只要你登入 GitHub 網站，所有的存檔都還完好無缺地躺在雲端伺服器裡。

Vibe Coder 的無腦 GitHub 流程 (Git 三部曲)

傳統工程師在操作 Git 的時候，會打開黑黑的終端機（Terminal），像個駭客一樣敲打 git add .、git commit -m "update" 這樣的神祕指令。

但身為講求效率的 Vibe Coder，我們能不用指令就不用指令！現代的編輯器（例如 Cursor）都內建了極度親民的 Source Control (原始碼控制) 圖形化介面。

你只需要記得這三個動作，俗稱「Git 雲端備份三部曲」：

1. 加入 (Stage / Add)

  • 概念：告訴系統「我這次修改了這 3 個檔案，幫我把它們放進購物車裡準備存檔」。
  • 情境：今天你請 AI 幫你把網頁背景改成深色模式，並增加了一個新的購物車按鈕。你會在介面上看到這兩個檔案旁邊出現了 + 號。點擊 + 號，就是把他們 Stage 起來。

2. 提交 (Commit)

  • 概念：為這次的存檔寫一個短短的說明（例如："新增深色模式與購物車按鈕"），這就像是在相片背後寫下日期與備註，然後按下快門，正式拍下快照。
  • Vibe 技巧：在 Cursor 裡面，你甚至不用自己想存檔說明。只要點擊輸入框旁邊的小星星圖示 (✨ Generate Message)，AI 就會自動看完你改了什麼程式碼，幫你寫出超專業的 Commit 訊息！

3. 推送 (Push)

  • 概念：按下上傳鍵！把這個剛拍好的快照，連同所有的程式碼，用力丟到 GitHub 雲端保險箱裡面去！
  • 結果：幾秒鐘後，你打開你的 GitHub 網頁，就會看到剛剛修改的檔案已經穩穩地躺在網路上了。

實戰演練：建立你的第一個 GitHub 專案庫 (Repository)

「專案庫 (Repository，常被工程師簡稱為 Repo)」就像是這個保險箱裡面的一個專屬資料夾，用來裝你這一次開發的專案。我們現在就來開一個新的：

  1. 前往 github.com 並免費註冊一個帳號。
  2. 登入後，點擊首頁右上角的 + 號，選擇 New repository。
  3. Repository name：為你的專案取個炫酷的名字（例如 my-vibe-store，注意不能有空格，請用減號分隔）。
  4. Description (選填)：寫下這個專案的用途（例如：我的第一個 AI 自動化電商網站）。
  5. 權限設定：這是最重要的一步。
    • 選擇 Public (公開)：全世界的人都能看到你的程式碼。好處是很多雲端伺服器（像 Vercel）對於公開的專案是完全免費無限部署的。
    • 選擇 Private (私有)：只有你邀請的人才能看到。如果裡面有商業機密，請務必選這個。
  6. 不要勾選其他的預設檔案，直接點擊最下方的綠色按鈕 Create repository。

恭喜你！你已經在雲端建好了一個專屬的空保險箱。 畫面上會出現一堆教你怎麼把電腦檔案丟上來的指令，你可以直接把那些指令複製，貼給你的 Cursor AI：

【請複製以下 Prompt 交給 AI 處理 Git 上傳】 我剛剛在 GitHub 建立了一個新的 Repo。 請幫我在終端機執行以下指令，把我們現在的專案初始化，並推送到這個網址： [在這裡貼上你的 Repo 網址，例如 https://github.com/YourName/my-vibe-store.git]

AI 會自動在背景幫你下好指令，一轉眼，程式碼就上去了！

🚨 Troubleshooting：AI 搞砸 Git 時的除錯指南

有時候，當你試圖要把程式碼 Push 上雲端時，會遇到一種叫做 「Merge Conflict (合併衝突)」 的地獄級報錯。 這通常發生在：你用兩台不同的電腦修改了同一個檔案，或是你有跟其他工程師合作時。

如果你在 Terminal 看到紅字顯示 CONFLICT (content): Merge conflict in ...，請不要慌張去亂刪檔案！

請立刻使用以下的除錯咒語：

【合併衝突急救 Prompt】 我在執行 git push 的時候遇到了 Merge Conflict，檔案 [檔名] 似乎有衝突。 請告訴我這代表什麼意思？ 並且請在編輯器中幫我找出衝突的區塊（通常會有 <<<<<<< HEAD 的標記），向我解釋兩邊的差異，並協助我保留最新、最正確的版本。

AI 就像是一個溫柔的導師，它會帶你看懂那些亂碼，並且幫你把衝突的文字自動清理乾淨，讓你順利完成上傳！

在下一章，我們將會教你如何將這個保險箱的鑰匙交給傳說中的 Vercel 伺服器，讓它瞬間把裡面的程式碼變成一個正式上線、全世界都能連上的網站！