Tạo Github Pages và sử dụng nó như 1 hosting miễn phí

Github ngoài chức năng lưu trữ code còn có một thứ khá hay ho nữa đó là Github pages. Với Github pages bạn hoàn toàn có thể tạo ra một site hoàn chỉnh với chi phí 0 đồng. Trong bài viết này tôi sẽ hướng dẫn bạn cách tạo Github Pages và sử dụng nó như 1 hosting miễn phí.

Giới hạn của github pages bạn nên biết

• Dung lượng project dùng làm github pages không vượt quá 1GB
• Băng thông tối đa 100GB/1 tháng
• Giới hạn build 10 lần/1 giờ

Như vậy nó khá phù hợp với site vừa và nhỏ với nhu cầu bandwidth không quá lớn, và hơn hết là nó free

Mỗi một tài khoản Github sẽ được chọn 1 project làm github page chính, thường project sẽ tên là username.github.io và trang homepage có dạng https://username.github.io.

File quy định việc hiển thị nội dung trên trang hompage có tên index.html đặt trực tiếp trong project username.github.io với css tùy chỉnh

Nếu các project khác cũng bật chế độ github page nó sẽ có dạng https://username.github.io/project_name/

Nếu các thư mục con (ví dụ xxx) trong project username.github.io cũng có file index.html ta sẽ truy cập theo địa chỉ https://username.github.io/xxx/

Raw file css, js để nhúng theo dạng https://username.github.io/xxx/yyy/zzz.js

Bước 1: Tạo mới 1 acc github, bỏ qua nếu bạn đã có

Truy cập https://github.com/join và điền các thông tin cần thiết, xác nhận email để hoàn tất cài đặt

Bước 2: Tạo mới 1 project dùng để làm github pages với tên là username.github.io và tích chọn như hình

Kết quả

Bước 3: Vào settings và bật chế độ github pages

Kết quả

Nếu bạn chọn theme nó sẽ tự tạo trang _index.html cho bạn và có thể truy cập ngay https://username.github.io

Đến đây bạn có thể thoải mái up các folder có chứa file index.html lên để có thể tạo các trang tĩnh phục vụ nhu cầu.

Bước 4: Để tạo hosting lưu trữ file miễn phí bạn tiến hành úp các folder chứa file lên

Và cuối cùng lấy link nhúng dạng https://username.github.io/xxx/yyy/zzz.js ví dụ https://hhcdn.github.io/clipboardjs/dist/clipboard.min.js

Thông thường các tác giả viết plugin họ cũng bật chế độ github pages làm demo luôn rất tiện. Hoặc dân thường như tôi thường dùng nó làm hosting lưu trữ css, js. Đường dẫn rất ngắn và dễ nhớ đồng thời cũng support cả https rất tuyệt, chỉ hơi vướng phần limit thôi :)) Nếu bạn có nhu cầu cao có thể mua các gói cao cấp hơn để sử dụng

Như vậy qua bài này tôi đã cùng các bạn tìm hiểu cách tạo github pages để tạo ra 1 site có domain khá quý tộc cũng như cách raw file lấy link nhúng hoàn toàn free

Chúc bạn thành công !