Git: Đẩy code lên GitHub sử dụng Visual Studio Code


Các khóa học qua video dành cho Hội viên:
Python Lập trình C Java C# SQL Server PHP HTML5-CSS3-JavaScript
<76K/month for all. Đăng ký Hội viên
Đăng ký nhận thông báo về những video mới nhất
Đẩy code lên GitHub sử dụng Visual Studio Code

Giới thiệu

Git là một phần mềm cho phép các lập trình viên có thể làm việc nhóm một cách hiệu quả và nhanh chóng. Tuy nhiên, rào cản lớn nhất đối với các lập trình viên mới khi sử dụng Git là việc git là một chương trình dòng lệnh, và các cú pháp lệnh của Git có thể khó nhớ đối với những người mới, hoặc cũng có thể họ ngại việc sử dụng dòng lệnh để tương tác với Git.

Bài viết sẽ hướng dẫn bạn đọc có thể sử dụng các chức năng của Git thông qua một giao diện đồ họa. Ở đây người viết sẽ sử dụng 2 phần mềm là Visual Studio Code (dưới đây sẽ gọi tắt là VS Code)

Các hướng dẫn dưới đây sẽ giả sử rằng máy tính bạn đọc đã cài đặt Git và VS Code, nếu máy tính chưa cài đặt các phần mềm này, bạn vui lòng cài đặt Git và VS Code trước khi theo các hướng dẫn dưới đây

Sau khi đã cài đặt Git, và VS Code thành công, giờ là lúc chúng ta sẽ đẩy code lên GitHub!

Đẩy code lên GitHub

Bưới 1: Tạo tài khoản GitHub: Bạn truy cập trang chủ GitHub tại github.com, sau đó nhấn nút Sign Up ở trên trang chủ. và điền các thông tin tại form để đăng ký một tài khoản GitHub

Tạo một tài khoản GitHub

Bước 2: Tạo một kho lưu trữ (Repository - dưới đây sẽ gọi tắt là repo): 

Sau khi đã tạo tài khoản (và xác nhận qua email), bạn sẽ được chuyển đến trang chủ của GitHub dành cho người dùng đã đăng nhập, Tại đây bạn nhấn nút New màu xanh ở cột Repositories hoặc bạn có thể nhấn vào menu dấu cộng ở cạnh hình đại diện của bạn, và chọn New Repository để tạo một repo mới:

Trang chính

Tại trang tạo repo mới, bạn điền các thông tin như sau:

Repository name: Đây là tên của repo của bạn. Nếu bạn muốn sử dụng repo này để triển khai một website tĩnh, bạn đặt tên repo của bạn theo định dạng: <username_của_bạn>.github.io

Description: Mô tả cho repo của bạn, dù phần này có thể không cần, tuy nhiên bạn vẫn nên đặt một mô tả ngắn gọn về repo của bạn ở đây.

Public/Private: Đây là các ô để bạn chọn có cho hiển thị repo của bạn cho bất kỳ ai, hoặc chỉ mình bận hoặc những người bạn thêm vào.

Ngoài ra, bạn sẽ có các tùy chọn sau, bạn có thể bỏ qua hoặc chọn (tick) những ô bạn cần:

Add a README file: lựa chọn này sẽ tạo sẵn một file README.md đặt ở thư mục gốc của repo của bạn, file này là phần mô tả chi tiết cho repo của bạn.

Add .gitignore: lựa chọn này sẽ tạo một thư mục .gitignore đặt ở thư mục gốc của repo, trong thư mục này sẽ ghi lại những tập tin mà bạn không muốn git theo dõi các thay đổi của nó trong repo của bạn.

Choose a license: Với lựa chọn này, bạn có thể chọn các giấy phép phù hợp cho repo sắp tới.

Sau khi đã điền các thông tin cần thiết, bạn nhấn nút Create repository để tạo repo của bạn.

Bước 3: Clone repo về máy:

Sau khi đã tạo repo thành công, giờ là lúc để ta clone repo này về máy. Bạn copy link của repo:

Sau khi đã copy link repo, bạn mở VS Code lên, tại màn hình chào mừng của phần mềm, bạn nhấn clone repository..., hoặc nếu tùy chọn không xuất hiện trên màn hình chào mừng, bạn có thể nhấn F1 (hoặc Ctrl + Shift + P), gõ vào lệnh git clone và nhấn Enter, sau đó dán link repo bạn vừa copy phía trên vào hộp nhắc của phần mềm rồi nhấn Enter:

Tiếp theo, bạn chọn nơi để lưu repo này trên máy tính và nhấn nút Select Repository Location:

Lúc này, quá trình clone sẽ bắt đầu, và bạn sẽ được yêu cầu xác thực trên GitHub để tiếp tục, bạn nhấn nút Sign in with your browser để cấp quyền cho phần mềm:

Sau khi đã xác thực thành cong với phần mềm, và quá trình clone hoàn tất, bạn sẽ được hỏi có muốn truy cập vào trong thư mục đã clone? Bạn nhấn nút Open để mở thư mục trong VS Code:

Vậy là xong, bạn đã ở trong repo mà bạn đã tạo trước đó!

Bước 4: Cập nhật thông tin trong Git:

Lúc này, bạn đã ở trong thư mục của repo, nhưng trước khi bạn có thể tiến hành ghi lại các thay đổi (Commit) trên git, bạn sẽ cần phải cung cấp 2 thông tin cho Git, đó là hai thuộc tính "user.name" và "user.password". Để cung cấp các thông tin này, bạn làm như sau:

Bạn mở một phiên Terminal trong VS Code bằng menu Terminal -> New Terminal. Một phiên Terminal mới sẽ xuất hiện, tại đây bạn thực hiện 2 lệnh sau:

git config --global user.name "Ten_cua_ban"

git config --global user.email "email_cua_ban"

Ghi chú:

  • Tùy chọn --global ở các câu lệnh phía trên sẽ khiến cho các giá trị bạn điền sẽ được áp dụng cho repo này, và tất cả các repo bạn làm việc về sau này. Nếu bạn chỉ muốn áp dụng cho repo đang làm việc hiện tại, bạn bỏ tùy chọn --global của lệnh này đi
  • Ở lệnh nhập email, bạn nên dùng email mà bạn đã sử dụng để đăng ký tài khoản GitHub của bạn
  • Nếu tài khoản của bạn có bật xác thực 2 lớp, hoặc bạn yêu cầu GitHub không công khai email của bạn, bạn sẽ cần phải sử dụng email của GitHub để GitHub có thể hiển thị chính xác tên bạn trên Commit, bạn có thể tìm email này tại trang Settings, phấn Email của tài khoản của bạn, email GitHub của bạn sẽ được hiển thị tại phần thông tin của ô tick Keep my email address private. Email này sẽ có đuôi @users.noreply.github.com

Bước 5:: Thêm các tập tin/thay đổi/và xóa các tập tin, trên thư mục vừa clone về, sau đó push các thay đổi lên GitHub:

Bạn sẽ làm việc với các tập tin trong thư mục như bình thường, thêm các file cần thiết, sửa đổi các file, xóa file không cần thiết, VS Code sẽ theo dõi các thay đổi trong repo này, và bạn sẽ nhìn thấy biểu tượng Source Control của VS Code sẽ đánh số tương ứng với số thay đổi phát hiện được trong repo: 

Khi nhấn vào đó, bạn sẽ nhìn thấy các thay đổi trong repo của mình:

Chú thích:

U (Untracked)Các tập tin này là các tập tin mới xuất hiện trong repo, và chưa được VS Code theo dõi, chúng sẽ được theo dõi sau lần Commit (ghi nhận thay đổi) này

M (Modified): Các tập tin này đã có các thay đổi so với lần Commit gần đây nhất

D (Deleted): Các tập tin này đã bị xóa khỏi repo, hoặc đã bị di chuyển ra khỏi repo

Nếu đã ưng ý với các thay đổi, bạn nhập nội dung của Commit này vào ô Message, hoặc nếu bạn chỉ muốn một số thay đổi được ghi lại trong lần Commit này, bạn nhấn dấu + tại tập tin mong muốn, sau đó nhập nội dung của lần thay đổi này vào ô Message, xong nhấn Ctrl + Enter để tiến hành Commit.

Nếu bạn Commit luôn mà không đánh dấu các file muốn ghi lại, VS Code sẽ hỏi bạn như sau:

Bạn có thể nhấn nút Yes để VS Code tự động Commit tất cả các tập tin ở lần Commit này, hoặc Always để luôn luôn Commit tất cả các thay đổi trong repo.

Sau khi đã Commit các thay đổi, bạn tiến hành Push (đẩy các thay đổi) lên GitHub, để push các thay đổi, bạn có thể mở menu của Source Control  và chọn Push:

Hoặc đơn giản hơn là bạn có thể nhấn nút Sync ở thanh trạng thái của VS Code, thao tác này sẽ thực hiện 2 quá trình, đó là Push và Pull (Lấy các thay đổi trên GitHub) về: 

Sau khi đã Push thành công, bạn kiểm tra trên GitHub:

» Next: Git: Thiết lập một kho lưu trữ
« Prev: Git: Đẩy code lên github
Các khóa học qua video dành cho Hội viên:
Python Lập trình C Java C# SQL Server PHP HTML5-CSS3-JavaScript
<76K/month for all. Đăng ký Hội viên
Copied !!!