Làm thế nào để tạo page Github bằng Jekyll?

14:10 12/12/2022

Với các lập trình viên, Github đã là dịch vụ lưu trữ mã nguồn hết sức quen thuộc. Đồng thời, Github cũng cung cấp dịch vụ Github Pages cho phép bạn lưu trữ các website của dự án, website cá nhân và tổ chức trên chính Github.

Một trong những ưu điểm của việc sử dụng Github lưu trữ website cá nhân đó là nó hoàn toàn miễn phí. Rất nhiều trường hợp Github đã giúp người dùng tiết kiệm được hơn 1 triệu đồng, xuất phát từ nhu cầu phải sử dụng để thuê hosting WordPress bên Namecheap mỗi năm. Ngoài ra, người dùng còn có thể sử dụng tên miền miễn phí dạng .github.io và cũng có thể dùng luôn các tên miền mà bản thân sở hữu như anhquandev02.com.

Bên cạnh lợi ích miễn phí, Github còn hỗ trợ Jekyll – vốn được biết là phần mềm tạo các website tĩnh từ các file Markdown hoặc html. Thông thường, chúng ta cần biên dịch tất cả các file sang mã html trước rồi mới upload lên các máy chủ lưu trữ. Nhưng với Github, điều đó là không cần thiết. Chúng ta hoàn toàn có thể chỉnh sửa các bài viết, các trang của website sử dụng Jekyll và commit lên Github.

Nhìn chung, nếu đã là một lập trình viên thì thao tác commit code lên Github là một việc khá quen thuộc bởi thông qua Github, việc làm website, viết blog sẽ trở nên thoải mái hơn rất nhiều.

Sau đây là hướng dẫn tạo Website bằng JekyII cho các bạn sinh viên:

Bước 1: Tải và cài đặt Ruby+Devkit Downloads rubyinstaller.org

Bước 2: Chạy ridk install đã cài đặt ở bước 1 sau hoàn thành, chọn cài đặt thứ 3

Bước 3: Mở command prompt (cmd) thay đổi (path) đến thư mục bạn muốn rồi cài đặt Jekyll and Bundler bằng dòng lệnh gem install jekyll bundler.

Bước 4: Tạo repository với tên định dạng như sau .github.io

Bước 5: Mở git bash và trỏ tới thư mục chứa nguồn file web và thay thế nó thành repo của bạn.

Bước 6: Dùng git init tạo repo.

Bước 7: Không khả dụng phát hành nguồn trang web của bạn. Ví dụ, nếu bạn muốn phát hành trang web ở thư mục docs như default branch thì tạo và thay đổi đường dẫn đến thư mục docs đó.

Nếu bạn muốn phát hành với branch abc khác có thể tạo 1 branch bằng git checkout -b abc

Bước 8: Tạo 1 trang Jekyll mới.

Bước 9: Mở Gemfile mà Jekyll vừa tạo và thêm “#” ở đầu dòng bắt đầu bởi gem “Jekyll” để chú thích dòng lại.

Bước 10: Thay đổi dòng lệnh # gem “github-pages” thành gem “github-pages”, “~> GITHUB-PAGES-VERSION”, group: :jekyll_plugins với GITHUB-PAGES-VERSION xem ở Dependency versions | GitHub Pages.

Bước 11: Lưu và đóng Gemfile. Sau đó tại git bash chạy lệnh bundle update và tuỳ chọn thay đổi 1 số thông tin ở file _config.yml.

Bước 12: (Tuỳ chọn) chạy thử web:

  • Mở git bash chạy bundle install (Nếu như đã install 1 lần và bước sau chạy lỗi nên dùng bundle update hoặc xoá file gemfile.lock)
  • Chạy lệnh bundle exec jekyll serve
Nếu dính lỗi webrick thì chạy lệnh bundle add webrick
  • Xem trang web bằng địa chỉ //localhost:4000

Bước 13: Add và commit.

Bước 14: Add your GitHub repository as a remote (git remote add …) và đẩy lên repo (git push).

Bước 15: Chọn nguồn phát hành trên trang github.com: Chọn setting-> Pages-> chọn sourse (bạn có thể thay đổi trạng thái phát hành public -> private hoặc ngược lại).

Vậy là thông qua bài viết này, chúng ta đã học cách tạo page Github bằng Jekyll để tiết kiệm chi phí cũng như đơn giản hóa những công việc đòi hỏi nhiều kỹ năng như website, viết blog. Chúc các bạn thực hiện thành công!

Bộ môn Ứng dụng phần mềm 

Cao đẳng FPT Mạng cá cược bóng đá Hà Nội

Cùng chuyên mục

Đăng Kí học Fpoly 2023

Bình Luận