/Projects
GitHub
ProjectsCS ChallengeDeploymentGitHub

ทำงานแบบทีม: branch, commit และ pull request

ใช้ใน Challenge Day 3

ถ้า 4 คนแก้ main พร้อมกัน โค้ดจะชนกันตลอด ทีมจริงจึงใช้ branch: แต่ละคนแตกสาขาไปทำงานของตัวเอง แล้วขอรวมกลับผ่าน pull request (PR) ให้เพื่อนรีวิวก่อน main จึงใช้งานได้เสมอ

At a glance

คำศัพท์ความหมาย
Branchสาขาของโค้ด ทำงานแยกได้โดยไม่กระทบ main
Pull request (PR)คำขอรวม branch เข้า main พร้อมให้คนอื่นรีวิว
Reviewเพื่อนอ่านโค้ด คอมเมนต์ หรือกด Approve
Mergeรวม branch เข้า main
Conflict2 คนแก้บรรทัดเดียวกัน ต้องเลือกเองว่าจะเอาอันไหน

How it works

main       ●────────────●──────────────●────▶   (Vercel deploy อัตโนมัติ)
            \          /              /
feat/menu    ●───●────●  (PR #1)     /
                  \                 /
fix/price          ●──────●────────●  (PR #2)

Set up the team

  1. หัวหน้าทีมสร้าง repo

    สร้าง repo บน GitHub แล้วไปที่ Settings → Collaborators เพิ่มเพื่อนทุกคน

  2. ทุกคน clone

    git clone https://github.com/<team>/shop.git
    cd shop
  3. ป้องกัน main (แนะนำ)

    Settings → Branches → Add rule ให้ main ต้องผ่าน pull request ก่อน merge

Flow ทุกครั้งที่ทำงาน

  1. ดึงโค้ดล่าสุด

    git switch main
    git pull
  2. สร้าง branch

    git switch -c feat/order-api
  3. เขียนโค้ดและ commit ทีละเรื่องเล็ก ๆ

    git add .
    git commit -m "feat: add POST /api/orders"
  4. Push branch

    git push -u origin feat/order-api
  5. เปิด pull request

    บน GitHub กด Compare & pull request ใส่คำอธิบายว่าทำอะไร แล้วขอ reviewer

  6. Review และ merge

    เพื่อนรีวิว → กด Merge → ลบ branch แล้วกลับไป git switch main และ git pull

คำสั่งหลัก

คำสั่งทำอะไร
git branchดูว่ามี branch อะไร และอยู่ที่ไหน
git switch -c <name>สร้าง branch ใหม่แล้วย้ายไป
git switch <name>ย้ายไป branch ที่มีอยู่
git push -u origin <name>push branch ขึ้น GitHub ครั้งแรก
git merge mainเอาของใหม่จาก main มารวมใน branch ตัวเอง
gh pr createเปิด PR จาก Terminal (ต้องมี GitHub CLI)

ตั้งชื่อ commit ให้ทีมอ่านรู้เรื่อง

Prefixใช้เมื่อตัวอย่าง
feat:เพิ่มฟีเจอร์ใหม่feat: add product list page
fix:แก้บั๊กfix: total price rounding
docs:แก้เอกสาร / READMEdocs: add setup steps
style:แก้หน้าตา ไม่เปลี่ยน logicstyle: card spacing
refactor:จัดโค้ดใหม่ ผลลัพธ์เท่าเดิมrefactor: move db to db.js

เมื่อเจอ merge conflict

Git จะใส่เครื่องหมายไว้ในไฟล์ให้เลือกเอง

<<<<<<< HEAD
const price = 60;        ← ของคุณ
=======
const price = 65;        ← ของที่เข้ามาใหม่
>>>>>>> main
  1. เลือก

    ลบเครื่องหมาย <<<<<<<, =======, >>>>>>> ให้เหลือโค้ดที่ถูก (VS Code มีปุ่ม Accept Current / Incoming)

  2. บันทึก

    git add .
    git commit -m "fix: resolve conflict"
  3. ส่งต่อ

    git push แล้ว PR จะอัปเดตเอง

ฝึกต่อ

เว็บสำหรับลงมือทำ

วิดีโอเรียนเอง

Next steps

CS ChallengeLast updated Oct 2026