วันอังคารที่ 28 พฤศจิกายน พ.ศ. 2560

การใช้งาน Git เบื้องต้น (บนเครื่อง Server)


          ในบทความที่แล้ว เราได้ฝึกใช้งาน Git บนเครื่องคอมพิวเตอร์ของตนเอง ซึ่งเพื่อน ๆ ก็คงพอจะเห็นประโยชน์จากการใช้งาน Git ไปบ้างแล้ว แต่ในความเป็นจริงถ้าเราจะใช้ Git ในการทำงานร่วมกับเพื่อน ๆ ในทีม ก็จำเป็นต้องย้าย Git ไปใช้งานบน Server โดยเว็ปไซต์ให้บริการ Git ที่แนะนำได้แก่ Github และ Bitbucket ซึ่งทั้งสองเว็บก็จะมีแนวคิดในการให้บริการที่แตกต่างกัน
  • Github จะเน้นไปทางด้าน Git Repository แบบสาธารณะ คือเปิดให้เราสามารถอัพโหลด Git Repository แบบที่ใคร ๆ ก็สามารถเข้าถึงได้อย่างฟรี ๆ ไม่จำกัดจำนวน แต่ถ้าจะทำ Git Repository แบบส่วนตัวก็ต้องเสียค่าใช้จ่าย
  • Bitbucket จะเน้นในด้านตรงข้ามของ Github นั่นคือเปิดให้อัพโหลด Git Repository แบบส่วนตัวได้ฟรีแบบไม่จำกัดจำนวน แต่มีการจำกัดจำนวนคนที่เข้าถึง Repository นั้น ๆ ต้องไม่เกิน 5 คน
          เราจะใช้บริการของ Bitbucket ที่ให้บริการ Git Repository แบบส่วนตัว โดยเราจะต้องสร้าง Git Repository ในเว็บ Bitbucket แล้วค่อยโหลดลงมาที่เครื่อง ซึ่งอันดับแรกก็ให้สมัครบริการในเว็บก่อน เข้าไป ที่นี่ แล้วกรอกอีเมลเริ่มสมัครได้เล้ยยยยย
กรอกอีเมล ชื่อ และรหัสผ่าน จากนั้นก็กดสมัคร
เมื่อสมัครเสร็จแล้วให้เราเข้าอีเมลไปกดยืนยันการสมัคร
หลังกดยืนยันแล้ว ให้เราตั้งชื่อ username เฉพาะตัว
กด Create a repository
ตั้งชื่อ Repository name จากนั้นก็กด Create repository
ให้ก็อปปี้ข้อความที่อยู่ในกรอบสีแดง

          ให้สร้างโฟลเดอร์เปล่า ๆ ขึ้นมา (เอาเป็นชื่อว่า git02 ละกัน) จากนั้นก็เปิด Git แล้วย้ายเข้าไปในโฟลเดอร์นั้น ๆ แล้ววางคำสั่งที่ได้ก็อปปี้มาจากในเว็บ
          ใส่รหัสผ่านแล้วกด Log in จากนั้น Git จะทำการโคลน Git Repository ที่เราสร้างขึ้นใน Bitbucket ลงมาในเครื่องของเรา

$ git clone https://wing_of_love@bitbucket.org/wing_of_love/test_git.git
Cloning into 'test_git'...
remote: Counting objects: 3, done.
remote: Compressing objects: 100% (2/2), done.
remote: Total 3 (delta 0), reused 0 (delta 0)
Unpacking objects: 100% (3/3), done.
          คำสั่ง  git clone URLที่เก็บไฟล์Git  จะทำการดึงข้อมูล Git Repository มาจาก URL ลงมาที่เครื่องของเรา ทีนี้ให้เราลองเข้าไปใน git02 ดู ก็จะพบว่ามีโฟลเดอร์ test_git โผล่ขึ้นมาโฟลเดอร์นึง ภายในจะมีไฟล์ README.md อยู่ไฟล์เดียว ให้ลองใช้คำสั่ง git status

$ git status
On branch master
Your branch is up-to-date with 'origin/master'.

nothing to commit, working tree clean
          จากผลลัพธ์จะเห็นได้ว่า Branch เริ่มต้นมีอยู่ 2 Branch ได้แก่ origin และ master โดยที่เครื่องของเราจะใช้งาน Branch master และที่เครื่อง Server จะใช้งาน Branch origin ซึ่งเมื่อเราแก้ไขไฟล์เสร็จแล้ว เราต้อง commit ใน master ก่อน จากนั้นจึงจะอัพโหลดไปยัง origin ว่าแล้วเราก็มาลองลงมือทำกันเลยดีกว่า เริ่มจากไปก็อปปี้ไฟล์ index.html จากในบทความที่แล้วมาใส่ในโฟลเดอร์ test_git

$ git status
On branch master
Your branch is up-to-date with 'origin/master'.

Untracked files:
  (use "git add <file>..." to include in what will be committed)

        index.html

nothing added to commit but untracked files present (use "git add" to track)
          วิธีใช้งานเบื้องต้นก็จะคล้าย ๆ กับในบทความที่แล้ว

$ git add index.html

$ git commit -m "Add index.html"
[master 45e7596] Add index.html
 1 file changed, 12 insertions(+)
 create mode 100644 index.html

$ git status
On branch master
Your branch is ahead of 'origin/master' by 1 commit.
  (use "git push" to publish your local commits)

nothing to commit, working tree clean
          หลังจาก commit ในเครื่องตนเองเสร็จแล้ว ถัดไปก็ให้ commit ขึ้น Server เพื่อแชร์ไฟล์ให้กับเพื่อนร่วมทีม ให้ใช้คำสั่ง  git push ชื่อBranchบนServer ชื่อBranchที่จะpushขึ้นไป 

$ git push origin master
Counting objects: 3, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 441 bytes | 147.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://bitbucket.org/wing_of_love/test_git.git
   0c26f61..45e7596  master -> master
          ทีนี้พอเข้าไปเช็คใน Bitbucket ก็จะพบว่ามีไฟล์ index.html เพิ่มเข้ามาใน Server แล้ว


          ขั้นตอนถัดไป เราจะทำการแก้ไขไฟล์บน Server จากนั้นก็แก้ไขไฟล์ในเครื่องตนเอง แล้ว commit ขึ้น Server ซึ่งเป็นการจำลองสถานการณ์ที่เราและเพื่อนแก้ไขไฟล์เดียวกัน เริ่มโดยการคลิกที่ชื่อไฟล์ index.html เพื่อแก้ไขไฟล์

กดปุ่ม Edit เพื่อทำการแก้ไขไฟล์
 
เพิ่มข้อความ "This is message from Bitbucket." ลงไปในไฟล์ index.html แล้วกดปุ่ม Commit
 
ป๊อปอัพให้บันทึกข้อความช่วยจำ พอพิมพ์ข้อความเสร็จแล้วให้กดปุ่ม Commit

          ถัดไปให้แก้ไขไฟล์ index.html ในเครื่องของเรา โดยการเพิ่มข้อความ "This is message from MASTER(Local)." จากนั้นก็ commit ให้เรียบร้อย

$ git add index.html

$ git commit -m "Edit index.html in local"
[master 7a69d8d] Edit index.html in local
 1 file changed, 1 insertion(+)
          หลังจาก commit เสร็จแล้ว ให้ใช้คำสั่ง  git fetch  เพื่อดึงข้อมูล Git Repository มาจาก Server แล้วใช้คำสั่ง  git status  เพื่อเปรียบเทียบระหว่าง Git Repository ของ Server และเครื่องของเรา

$ git fetch
remote: Counting objects: 3, done.
remote: Compressing objects: 100% (3/3), done.
remote: Total 3 (delta 1), reused 0 (delta 0)
Unpacking objects: 100% (3/3), done.
From https://bitbucket.org/wing_of_love/test_git
   45e7596..7af3ffa  master     -> origin/master

$ git status
On branch master
Your branch and 'origin/master' have diverged,
and have 1 and 1 different commits each, respectively.
  (use "git pull" to merge the remote branch into yours)

nothing to commit, working tree clean
          จากคำสั่ง  git status  เราจะพบว่า Git Repository จาก Server และเครื่องของเรามีค่าไม่ตรงกัน ทำให้ใช้งานคำสั่ง git push เพื่ออัพโหลดไฟล์ไปยัง Server ไม่ได้

$ git push origin master
To https://bitbucket.org/wing_of_love/test_git.git
 ! [rejected]        master -> master (non-fast-forward)
error: failed to push some refs to 'https://wing_of_love@bitbucket.org/wing_of_love/test_git.git'
hint: Updates were rejected because the tip of your current branch is behind
hint: its remote counterpart. Integrate the remote changes (e.g.
hint: 'git pull ...') before pushing again.
hint: See the 'Note about fast-forwards' in 'git push --help' for details.
          เราจำเป็นต้องดึงอัพเดตล่าสุดมาจาก Server ก่อน ให้เราใช้คำสั่ง  git pull  เพื่ออัพเดต Git Repository ในเครื่องของเราให้กลายเป็นเวอร์ชันล่าสุด ซึ่งคำสั่ง  git pull  จะเป็นการทำ  git fetch  และต่อด้วย  git merge  โดยอัตโนมัติ

$ git pull
Auto-merging index.html
CONFLICT (content): Merge conflict in index.html
Automatic merge failed; fix conflicts and then commit the result.
          หลังจากใช้คำสั่ง  git pull  จะเห็นได้ว่าเกิด Merge Conflict เนื่องจากไฟล์ทั้งสองมีการแก้ไขทั้งคู่ จึงทำให้ Git ไม่สามารถตัดสินใจได้ว่าจะเลือกเก็บการเปลี่ยนแปลงของไฟล์ไหน ให้เราแก้ไขไฟล์ (ดูวิธีแก้ไข Merge Conflict ได้ ที่นี่) จากนั้นค่อย commit แล้ว push ขึ้น Server ทีหลัง

$ git add index.html

$ git commit -m "Update index.html"
[master 6d43d08] Update index.html

$ git push origin master
Counting objects: 6, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (6/6), done.
Writing objects: 100% (6/6), 635 bytes | 317.00 KiB/s, done.
Total 6 (delta 2), reused 0 (delta 0)
To https://bitbucket.org/wing_of_love/test_git.git
   7af3ffa..6d43d08  master -> master


การใช้ Reset

          ในการพัฒนาระบบย่อมมีการผิดพลาดกันบ้างเป็นธรรมดา เช่นว่า เราอาจจะเพิ่มโค้ดใหม่ ๆ ลงไป แต่โค้ดใหม่เจ้ากรรมก็ดันทำให้ระบบเกิด Error แล้วแก้ไขให้กลับไปเป็นเหมือนเดิมไม่ได้ ซึ่งถ้าเราใช้ Git ในการพัฒนาระบบ ปัญหาในจุดนี้ก็จะหมดไป เนื่องจาก Git มีความสามารถในการย้อนไฟล์คืนกลับมา ซึ่งตัวอย่างจากบทความที่แล้วเป็นการเรียกไฟล์ที่ถูกลบทิ้งไปแล้วให้กลับคืนมา แต่ในส่วนนี้เราจะใช้คำสั่ง  git reset หมายเลขcommit7ตัวแรก  เพื่อย้อนกลับไปยัง commit เก่า ๆ

          เริ่มต้นโดยการเปิดไฟล์ index.html ขึ้นมา จากนั้นก็เพิ่มข้อความว่า "This is Error Message." จากนั้นก็เซฟไฟล์แล้วก็ commit

$ git add index.html

$ git commit -m "Add error message into index.html"
[master 75975d8] Add error message into index.html
 1 file changed, 1 insertion(+)
          จากนั้นให้เราใช้คำสั่ง git log เพื่อแสดงประวัติการ commit ซึ่งเราจะเห็นเลขรหัสของแต่ละ commit (ตัวอักษรสีเหลือง ๆ นั่นแหละ) รวมไปถึงว่าแต่ละ commit นั้นมีใครเป็นคนแก้ไข

$ git log
commit 75975d8ff0f3f596b2fcf8b5b65d68a2c085689f (HEAD -> master)
Author: AiNoTsubasa <ooo@hotmail.com>
Date:   Mon Nov 27 09:36:29 2017 +0700

    Add error message into index.html

commit 6d43d088d0656689c7680ac8a1f3f08f8d5b3823 (origin/master, origin/HEAD)
Merge: ed2e63e 7af3ffa
Author: AiNoTsubasa <ooo@hotmail.com>
Date:   Fri Nov 24 21:09:06 2017 +0700

    Update index.html

commit ed2e63efe2895d98e1cd0ca57e86645a1b669d77
Author: AiNoTsubasa <ooo@hotmail.com>
Date:   Fri Nov 24 20:26:21 2017 +0700

    Edit index.html in local

commit 7af3ffa9ca5f27c4df64b80fca5592c89e445d10
Author: Akatsuki <akatsuki.sunshine@hotmail.com>
Date:   Fri Nov 24 07:58:55 2017 +0000

    index.html edited online with Bitbucket

commit 45e7596bc91e15c9e29a90dc2812d5b62586c595
Author: AiNoTsubasa <ooo@hotmail.com>
Date:   Fri Nov 24 14:02:08 2017 +0700

    Add index.html

commit 0c26f61a6c9802f21b3a3faf6d7c07d52660aca3
Author: Akatsuki <akatsuki.sunshine@hotmail.com>
Date:   Thu Nov 23 07:42:42 2017 +0000

    Initial commit
          ให้เราก็อปปี้หมายเลข commit 7 ตัวแรกของ commit ที่เราต้องการจะย้อนกลับ แล้วใช้คำสั่ง  git reset หมายเลขcommit7ตัวแรก  เพื่อลบการ commit ล่าสุด และใช้คำสั่ง  git status  ในการเช็คสถานะ

$ git reset 6d43d08
Unstaged changes after reset:
M       index.html

$ git status
On branch master
Your branch is up-to-date with 'origin/master'.

Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)

        modified:   index.html

no changes added to commit (use "git add" and/or "git commit -a")
          ผลลัพธ์ที่ได้คือเราได้ย้อนเวลากลับไปที่ commit นั้น และไฟล์ index.html ก็กลับไปอยู่ในสถานะ Unstaged ซึ่ง ณ จุดนี้ เราสามารถเลือกได้ว่าจะใช้คำสั่ง add เพื่อเตรียม commit หรือใช้คำสั่ง checkout เพื่อลบโค้ดที่เราเพิ่มเข้าไปได้


การใช้ .gitignore

          การ add ไฟล์ด้วยคำสั่ง  git add *  ถือเป็นวิธีที่ง่ายและสะดวกมาก เพราะเป็นการ add ไฟล์ทั้งหมดในทีเดียวโดยที่เราไม่จำเป็นต้องระบุชื่อไฟล์ แต่สิ่งที่ตามมาก็คือการ add ไฟล์ที่ไม่ต้องการเข้าไปด้วย (เช่น ไฟล์ที่บันทึก Log ของระบบ เป็นต้น) ซึ่งเราก็มีวิธีแก้ปัญหานี้ด้วยการกำหนดไฟล์ที่ไม่ต้องการ add ลงในไฟล์ .gitignore

          อันดับแรกให้สร้างไฟล์ log_file.txt ขึ้นมา จากนั้นให้ใช้คำสั่ง  git status  เพื่อเช็คสถานะแล้วจะพบว่ามีไฟล์ log_file.txt ให้รอการ add ไฟล์อยู่

$ git status
On branch master
Your branch is up-to-date with 'origin/master'.

Untracked files:
  (use "git add <file>..." to include in what will be committed)

        log_file.txt

nothing added to commit but untracked files present (use "git add" to track)
          ถัดไปให้ทำการสร้างไฟล์ .gitignore ขึ้นมา ด้วยคำสั่ง  vi .gitignore  จากนั้นก็กดคีย์บอร์ดปุ่ม i เพื่อเริ่มเขียนข้อความว่า *.txt (เป็นการระบุว่าทุกไฟล์ที่มีนามสกุล .txt) จากนั้นกดคีย์บอร์ดปุ่ม Esc พิมพ์ :qw แล้วกดคีย์บอร์ดปุ่ม Enter เพื่อเป็นการบันทึกและออกจากโหมดการพิมพ์ข้อความ แล้วใช้คำสั่ง  git status  จะเห็นว่าไฟล์ที่ต้อง add เปลี่ยนไปจาก log_file.txt เป็น .gitignore แทน เนื่องจากในไฟล์ .gitignore ระบุไว้ว่าไม่ให้ track ทุกไฟล์ที่มีนามสกุล .txt

$ git status
On branch master
Your branch is up-to-date with 'origin/master'.

Untracked files:
  (use "git add <file>..." to include in what will be committed)

        .gitignore

nothing added to commit but untracked files present (use "git add" to track)
          ที่เหลือก็แค่ commit แล้ว push ขึ้น Server เพียงเท่านี้เราก็สามารถควบคุมไฟล์ที่จะให้ Git คอยตาม track ได้แล้ว ทำให้เราสามารถใช้คำสั่ง  git add *  ได้อย่างสบายใจ (ฮา)

$ git add .gitignore
warning: LF will be replaced by CRLF in .gitignore.
The file will have its original line endings in your working directory.

$ git commit -m "Add gitignore file."
[master 84c5454] Add gitignore file.
 1 file changed, 1 insertion(+)
 create mode 100644 .gitignore

$ git push origin master
Counting objects: 3, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (2/2), done.
Writing objects: 100% (3/3), 324 bytes | 162.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://bitbucket.org/wing_of_love/test_git.git
   6d43d08..84c5454  master -> master

          สรุป Git ถือเป็นเคริ่องมือที่มีประโยชน์ (ตามที่ได้กล่าวเอาไว้แล้ว) และช่วยสนับสนุนในการพัฒนาระบบ ดังนั้นการใช้งาน Git ถือเป็นสิ่งที่นักพัฒนาต้องเรียนรู้และใช้ให้เป็น และหวังว่าบทความการใช้งาน Git เบื้องต้นนี้จะช่วยให้เพื่อน ๆ เข้าใจและสามารถเริ่มต้นใช้งาน Git ได้

สรุปคำสั่ง

git clone URLที่เก็บไฟล์Git : ใช้ดึงข้อมูล Git Repository มาจาก URL ลงมาที่เครื่องของเรา
git push ชื่อBranchบนServer ชื่อBranchที่จะpushขึ้นไป : ใช้ในการส่ง commit จากเครื่องของเราไปอัพเดตที่ Git Repository บน Server
git pull : ใช้อัพเดต Git Repository ในเครื่องของเราให้เป็นตาม Git Repository บน Server
git fetch : ใช้โหลด Git Repository ของ Server ลงมาที่เครื่องของเราเพื่อใช้เปรียบเทียบความแตกต่างของ Git Repository จากทั้งสองที่
git reset หมายเลขcommit7ตัวแรก : ใช้ย้อนกลับไป commit ที่ต้องการ

Share:

0 comments:

แสดงความคิดเห็น