前言

上一篇我們認識了 GitHub Flow 的核心概念：「main 永遠可部署，所有變更透過分支進行」。這篇文章將帶你實際操作——從建立分支到發起 Pull Request，完整走過一次 GitHub Flow 的前半段流程。

作為 Vibe Coder，你會經常看到 AI 助手建議你「建立一個新分支」或「發起 PR」。理解這些操作的意義，能幫助你更有效地與 AI 協作。

學習目標

讀完本篇後，你將能夠：

• 建立功能分支並正確命名
• 在分支上提交變更
• 在 GitHub 上發起 Pull Request

從 main 分支建立功能分支

為什麼要建立分支？

想像 main 分支是一條主要道路，永遠保持暢通。當你要施工（開發新功能）時，不會直接在主道路上動工，而是開闢一條臨時支線。這樣即使支線出了問題，主道路依然不受影響。

建立分支的指令

# 確保你在 main 分支上，並取得最新版本
git checkout main
git pull origin main

# 建立並切換到新分支
git checkout -b feature/add-login-button
Code language: PHP (php)

讓我們拆解這段指令：

-b 參數是「建立（branch）」的意思，讓你一步完成「建立 + 切換」兩個動作。

確認目前所在分支

git branch

輸出會是：

  main
* feature/add-login-button

星號（*）表示你目前所在的分支。

分支命名慣例

好的分支名稱能讓團隊成員一眼看出這個分支的用途。常見的命名慣例：

常用前綴

命名原則

feature/簡短描述-用連字號分隔

好的命名：

• feature/add-dark-mode
• bugfix/fix-cart-total
• hotfix/patch-xss-vulnerability

避免的命名：

• my-branch（不知道做什麼）
• feature/AddNewUserRegistrationFormWithValidation（太長）
• fix（太模糊）

在分支上進行開發與 commit

基本開發流程

切換到新分支後，你就可以開始開發了。每完成一個小功能，就提交一次：

# 查看目前的變更
git status

# 將變更加入暫存區
git add .

# 提交變更
git commit -m "Add login button to header"
Code language: PHP (php)

讀懂 git status 的輸出

On branch feature/add-login-button
Changes not staged for commit:
  modified:   src/components/Header.js

Untracked files:
  src/components/LoginButton.js

推送分支到遠端

當你準備好讓其他人看到你的變更時，把分支推送到 GitHub：

git push origin feature/add-login-button

第一次推送新分支時，你可能會看到建議設定上游分支的訊息。使用 -u 參數可以同時設定：

git push -u origin feature/add-login-button

設定後，之後在這個分支上只需要 git push 即可。

發起 Pull Request 的步驟

推送分支後，就可以在 GitHub 上發起 Pull Request（PR）了。

方法一：透過 GitHub 網頁

1. 前往你的 GitHub repository 頁面
2. 你會看到一個黃色提示框：「feature/add-login-button had recent pushes」
3. 點擊「Compare & pull request」按鈕
4. 填寫 PR 標題和描述
5. 點擊「Create pull request」

方法二：使用 GitHub CLI

gh pr create --title "Add login button" --body "新增登入按鈕到頁面標頭"
Code language: JavaScript (javascript)

這個指令會：

• 自動偵測目前分支
• 建立一個 PR 到 main 分支
• 設定指定的標題和描述

PR 標題與描述的撰寫技巧

標題撰寫原則

好的 PR 標題應該：

• 簡潔說明這個 PR 做了什麼
• 使用動詞開頭（Add、Fix、Update、Remove）
• 控制在 50 字元以內

範例對照：

描述的基本結構

## 變更內容
- 在 Header 元件中新增登入按鈕
- 新增 LoginButton 元件

## 為什麼需要這個變更
讓使用者可以從任何頁面快速進入登入流程

## 如何測試
1. 啟動開發伺服器
2. 點擊右上角的登入按鈕
3. 確認能正確跳轉到登入頁面
Code language: PHP (php)

這樣的描述讓 reviewer 能快速理解：

• 做了什麼：具體的變更項目
• 為什麼做：變更的理由和背景
• 怎麼驗證：如何測試這些變更

實戰演練：完整流程

讓我們用一個最小範例走過完整流程：

# 1. 確保在最新的 main 分支
git checkout main
git pull origin main

# 2. 建立功能分支
git checkout -b feature/update-readme

# 3. 進行修改（假設修改了 README.md）
# ... 編輯檔案 ...

# 4. 查看變更
git status

# 5. 提交變更
git add README.md
git commit -m "Update README with installation instructions"

# 6. 推送到遠端
git push -u origin feature/update-readme

# 7. 發起 PR
gh pr create --title "Update README with installation instructions" \
  --body "新增安裝說明，讓新用戶更容易上手"
Code language: PHP (php)

常見問題

Q: 我忘記先建立分支就開始改 code 了，怎麼辦？

如果你還沒 commit，可以這樣補救：

# 先把變更暫存起來
git stash

# 建立並切換到新分支
git checkout -b feature/my-changes

# 把變更拿回來
git stash pop
Code language: PHP (php)

Q: 分支名稱打錯了，可以改嗎？

可以，使用 -m 參數：

git branch -m 舊名稱 新名稱

如果已經推送到遠端，需要額外處理遠端分支。

重點回顧

• 建立分支：git checkout -b feature/功能名稱
• 命名慣例：使用 feature/、bugfix/、hotfix/ 前綴
• 推送分支：git push -u origin 分支名稱
• 發起 PR：在 GitHub 網頁點擊「Compare & pull request」或使用 gh pr create
• PR 描述：說明做了什麼、為什麼做、如何測試

下一步

在下一篇文章中，我們將學習如何進行 Code Review——這是 GitHub Flow 中確保程式碼品質的關鍵環節。你將學會如何審查別人的 PR，以及如何回應 review 意見。