วันนี้ดูเพลินจะมาสอนใช้งานโปรแกรม Sourcetree ให้กับเพื่อน ๆ กัน เราจะมาเริ่มสอนกันตั้งแต่เริ่มใช้งานการ Clone โปรเจค และไล่ไปจนถึงการ Push code จาก Local ไปยัง Remote repository กันเลย
หากคุณยังไม่รู้ว่า Sourcetree คืออะไร คลิกอ่านได้ที่นี่
หากคุณยังไม่ได้ติดตั้งโปรแกรม SourceTree ก็ให้ไป Download โปรแกรมก่อนที่ลิงค์
https://www.sourcetreeapp.com/
หัวข้อ วิธีการใช้งาน SourceTree
วิธี Clone repository ด้วย SourceTree
1. เลือกเมนู File > Clone / New... หรือ กด Crtl + N
2. ใส่ข้อมูลตามลำดับต่อไปนี้ จากนั้นกดปุ่ม Clone
- Source path / URL << Copy มาจาก Github หรือ Bitbucket
- Destination path << Folder Path สำหรับเก็บ Local Repo
- Name << ใส่ชื่อที่ต้องการ
- Local Folder << กำหนดเป็น [Root]
- Advance options << สามารถเลือก Branch อื่นที่ไม่ใช่ Master ได้
3. เมื่อ Clone เสร็จแล้วก็จะเจอหน้าต่างประมาณนี้
วิธีใช้งาน Checkout Branch ด้วย SourceTree
วิธี Checkout remote branch ด้วย SourceTree
ไปที่เมนู "REMOTES > orgin" จากนั้นคลิกขวาที่ Branch ที่ต้องการแล้วเลือก "Checkout origin:<branch name>"
จากนั้นจะมีหน้าต่างให้เราตั้งชื่อ Local Branch แนะนำให้ใช้ชื่อเหมือนกับ Remote branch จะได้ไม่สับสน
เมื่อ Checkout เสร็จแล้วก็จะมี Branch ใหม่แสดงขึ้นมาที่ส่วนนี้
วิธี Checkout Local Branch ด้วย SourceTree
ไปที่เมนู "BRANCHES" จากนั้นคลิกขวาที่ Branch ที่ต้องการแล้วเลือก "Checkout<branch name>"
เมื่อ Checkout เสร็จแล้วก็จะมาอยู่ที่ Branch ที่เราเลือก (สังเกตุจะมีจุดไข่ปลา และตัวอักษรหนาขึ้นตรง Branch ที่เรากำลังเลือกอยู่)
วิธีการ Checkout (ย้อน commit) ด้วย SourceTree
คลิกขวาที่ Commit ที่ต้องการ จากนั้นคลิกขวาแล้วเลือก "Checkout"
SourceTree จะทำการ Pointing Header มายัง Commit ที่เราเลือก หากต้องการกลับไปที่ Branch ก็เพียงแค่คลิกขวาแล้วเลือก Checkout ที่ Branch ตามวิธีด้านบน
วิธีสร้าง Branch ใหม่ด้วย SourceTree
- Checkout ไปยัง Branch ที่เราต้องการใช้เป็น Branch หลัก
- จากนั้นคลิกที่ปุ่ม Branch
- ตั้งชื่อให้กับ Branch ใหม่จากนั้นกด Create Branch
- ตอนนี้เราก็สร้าง Branch ใหม่เสร็จเรียบร้อยแล้ว
วิธี Add และ Commit ด้วย Source
- Staged files หรือ Git Stage คือ การทำเครื่องว่าไฟล์นี้ได้รับการแก้ไขและพร้อมที่จะทำการ Commit ไฟล์เหล่านั้น
1.1 ปุ่ม Unstage All คือ SourceTree จะย้ายไฟล์ทั้งหมดใน Staged files กลับไปยัง Unstaged files
1.2 ปุ่ม Unstage Selected คือ SourceTree จะย้ายไฟล์ที่ถูกเลือกใน Staged files กลับไปยัง Unstaged files - Unstaged files คือ ไฟล์ที่ยังไปถูก Add ไปยัง Stage (ไฟล์ที่อยู่ในส่วนนี้จะไม่ถูก Commit)
2.1 ปุ่ม Stage All คือ SourceTree จะย้ายไฟล์ทั้งหมดใน Unstaged files กลับไปยัง Staged files
2.2 ปุ่ม Stage Selected คือ SourceTree จะย้ายไฟล์ที่ถูกเลือกใน Unstaged files กลับไปยัง Staged files - ช่องสำหรับใส่ Comment สำหรับ Commit
- ปุ่ม Commit โดย SourceTree จะทำการ Commit ไฟล์ทั้งหมดที่อยู่ใน Staged files เข้า Branch
วิธี Merge Branch ด้วย SourceTree
ใช้ในกรณีที่เราต้องการรวมโค้ดจาก 2 Branch เข้าได้วยกัน มักถูกใช้ในกรณีที่คุณทำงานหลาย ๆ งานพร้อมกันภายใน Local Repository โดยปกติแล้วเรามักจะสร้าง 1 Branch ต่อ 1 งาน เช่น
- Branch เปลี่ยน Style header
- Branch แก้ไขหน้า Contact Form
- Branch Update plugin
ที่นี่ หากคุณต้องการ Merge code ใน Branch Update plugin เพื่อรวมเข้ากับ Branch Master เราจะต้องทำยังไงละ ก็ทำแบบนี้ไงคะ
- Checkout ไปยัง Branch หลัก
- คลิกขวาดที่ Branch ที่เราต้องการ Merge
- เลือก Merge <branch name> จากนั้นคลิก OK บน Pop up ที่แสดงขึ้นมา
วิธี Fetch, Pull, Push ด้วย SourceTree
หากคุณอยากดูคำอธิบายเพิ่มเติมเกี่ยวกับเรื่อง คำสั่ง Git Fetch, Pull, Push เพิ่มเติม สามารถ คลิกอ่านที่นี่
การใช้งาน Pull ด้วย SourceTree
Tip: เมื่อกดปุ่ม "Pull" จะแสดงหน้าต่างนี้ขึ้นมา คุณสามารถPull Remote branch อื่นมายัง Local branch ด้วย เช่น หากคุณทำงานอยู่ใน Branch "my_edit" แต่คุณ Merge code ล่าสุดจาก Branch "master" เข้ามา Branch "my_edit" คุณก็สามารถเลือก "Remote branch to pull" เป็น "master" จากนั้นก็กด pull
การใช้งาน Push ด้วย SourceTree
Tip 1: เมื่อกดปุ่ม "Push" หาว่า Brach ที่คุณทำการ Push นั้นยังไม่มีการสร้าง Remote branch ในช่อง "Remote branch" นะแสดงคำอธิบายเป็น ค่าว่าง หากว่าคุณต้องการ Push local branch ของคุณขึ้นไปยัง Remote branch ให้ทำการติกถูกหน้า Lacal branch ของคุณจากนั้นจึงกดปุ่ม Push
Tip 2: คุณยังสามารถ Push code ข้าม Branch ได้อีกด้วย จากรูปตัวอย่างคุณสามารถ Push local branch "Dooplearn" ไปยัง Remote branch "master" ด้วยการระบุตัวเลือกตามตัวอย่างด้านล่างจากนั้นก็กดปุ่ม Push
บทความอื่น ๆ ที่เกี่ยวข้องกับเรื่อง GIT
- GIT Repositories คืออะไร มีกี่ประเภท ใช้งานยังไง
- คําสั่ง GIT พื้นฐาน คำสั่งที่ใช้บ่อย ตัวอย่างการใช้งานอย่างละเอียด
- SourceTree คืออะไร วิธีการใช้งาน ร่วมกับ GitHub
- สอนใช้ Sourcetree วิธีการใช้งาน ตั้งแต่ไม่เป็นจนโปร
- Git checkout คืออะไร ตัวอย่างการใช้งาน วิธีย้อน commit
- แก้ปัญหา git error: Your local changes to ... overwritten by merge:
- แก้ปัญหา git error: The following untracked ... overwritten by merge:
เป็นยังไงกันบ้างคะ ไม่ยากเลยใช่ไหมละกับวิธีการใช้งานโปรแกรม SourceTree ที่เรานำมาให้อ่านกัน ดูเพลินก็หวังว่าบทความของเราจะเป็นประโยชน์ต่อท่านไม่มากก็น้อย นอกจากนี้ เรายังมีบทความดี ๆ อีกมากมาย คุณสามารถลองคลิกเขาไปอ่านบทความอื่น ๆ ตามลิงค์ด้านล่างได้เลย