Hướng dẫn link html github - liên kết html github
|
Bạn có 1 trang web tĩnh (static web chỉ gồm HTML CSS JS) và muốn đẩy lên mạng để chia sẻ cho người khác mà không mất phí? Hãy tận dụng Github - nền tảng lưu trữ, quản lý và chia sẻ mã nguồn mở hàng đầu hiện nay. Show
Ngoài việc lưu trữ và quản lý mã nguồn, Github còn cung cấp một dịch vụ cho phép hosting static web là Github Pages. Source code lưu trữ trực tiếp trên Github và truy cập thông qua tên miền miễn phí là [username].github.io. Ví dụ username trên github của bạn là robinhuy thì bạn sẽ có 1 tên miền miễn phí là https://robinhuy.github.io.
Cách 1: Tạo repository với tên trùng với tên miền Github PagesVí dụ bạn có username là sophshep, vậy chỉ cần tạo 1 public repository với tên là sophshep.github.io và đẩy code web tĩnh lên đó là xong. Chúng ta sẽ có ngay 1 website và truy cập theo đường dẫn giống với vị trí của file HTML trong repository. Chú ý không viết sai chính tả. Với tên file là index.html thì khi gõ lên trình duyệt có thể bỏ qua. Ví dụ gõ https://sophshep.github.io/ và https://sophshep.github.io/index.html thì kết quả là như nhau. Cách 2: Tạo một repository với tên bất kỳ khác tên miền Github PagesTạo 1 public repository và đẩy code web tĩnh lên. Sau đó vào mục Settings của repository đó để bật cấu hình Github Pages.Settings của repository đó để bật cấu hình Github Pages. Kéo xuống phần Github Pages, chọn chuyển qua trang cấu hình cho Github Pages. Chọn branch mà bạn muốn đẩy code lên (thường là main hoặc master), sau đó bấm Save.Save. Sau khi cấu hình xong, chúng ta coi như repository hiện tại là một thư mục con của repository https://[username].github.io và truy cập tương tự. Ví dụ tên repository là my-website thì sẽ truy cập địa chỉ là https://[username].github.io/my-website/ (trong repository có file index.html). Cách 3: Sử dụng website raw.githack.comSử dụng website https://raw.githack.com/, chúng ta có thể xem kết quả hiển thị của bất kỳ file HTML trong bất kỳ repository nào. Tuy nhiên trang web có thể sẽ bị lỗi hiển thị nếu như bị sai đường dẫn (do đường dẫn bị thay đổi khi xem qua raw.githack.com). Ngoài 3 cách trên, nếu bạn còn biết cách nào nữa thì hãy comment chia sẻ xuống dưới nhé. Nguồn: https://huydq.dev Đăng kýĐăng nhập Đăng ký xong bạn sẽ vào github của riêng bạn (hiện tại bạn sẽ chưa có repository nào). 2. Tạo RepositoryRepository là một kho chứa code của bạn trên server. Để tạo mới respository, bạn nhấn vào nút dấu cộng ở góc trên bên phải màn hình. Bạn hãy đặt tên cho repository của mình ngắn gọn dễ hiểu và có tính mô tả Bạn nhấn Create Repository để hoàn tất. Và sau đây là cửa sổ hiển thị sau khi hoàn thành. 3. Dùng GitHub Desktop3.1 Cài đặt GitHub DesktopSau khi bạn tạo xong repository, thì bạn đã thấy các câu lệnh cơ bản để thao tác với git trên cửa sổ console là: git init, git commit ... Bạn download, cài đặt và login với email đã đăng ký github. 3.2 Clone Repository về máy localCÁCH 1: Vào Github Desktop, nhấn File chọn Clone Repository: Dùng đường link git để clone về Sau khi clone về, thì bạn sẽ có repository ở local (kéo được code trên server về máy mình) Sau khi clone về, thì bạn sẽ có repository ở local (kéo được code trên server về máy mình) CÁCH 2: Hoặc vào lại git, bạn sẽ thấy cửa sổ này Nhấn vào github bạn sẽ tháy đoạn Setup in Desktop, và thấy cửa sổ sau: Nhấn Clone để kéo code về máy (chú ý folder lưu trữ trên máy). Nhấn vào github bạn sẽ tháy đoạn Setup in Desktop, và thấy cửa sổ sau: Nhấn Clone để kéo code về máy (chú ý folder lưu trữ trên máy). Cửa sổ sau khi clone được repository trên máy chủ về là: 4. Commit code bằng GitHub Desktop Bạn mở thư mục đã được clone trên local. Để mở folder có nhiều cách, một cách ở đây là click chuột phải vào repository rồi chọn Reveal in Finder (trên Mac) hoặc Show in Explorer (trên Windows) click chuột phải vào repository rồi chọn Reveal in Finder (trên Mac) hoặc Show in Explorer (trên Windows) Hoặc bạn có thể mở trực tiếp folder theo cách thông thường - nếu bạn vẫn nhớ mình đã setup thư mục nào ở bước 3.
Bạn tạo mới folder và file nào tuỳ ý (ví dụ tôi tạo folder lab1, và file readme.txt với một chút nội dung) Nếu bạn cần nộp code theo từng bài lab, hãy đưa code vào folder tương ứng Sau đó quay lại cửa sổ github desktop bạn sẽ thấy thông báo có thay đổi (ở đây có vài file khác ngoài readme.txt là do tôi đang dùng Intellij để tạo - bạn bỏ qua các file đó) Bạn để ý ở góc trái, bạn nhập nội dung vào đó để commit Bạn nhất Commit to master để gửi code lên server Bạn để ý ở góc trái, bạn nhập nội dung vào đó để commit Bạn nhất Commit to master để gửi code lên server
Sau khi commit xong, bạn nhấn tiếp publish Bạn vào github trên server check lại Vậy là bạn đã commit thành công Vậy là bạn đã commit thành công 4. Gửi link RepositoryĐể chia sẻ source code cho người khác xem được, bạn hãy vào phần Clone/Download để lấy link gửi cho họ (ví dụ cô giáo bạn cần bạn nộp bài :D) Tip Well Done :) vậy là bạn đã tạo github thành công! Hãy thường xuyên commit code nhé :) đó chính là kho tàng code của bạn và cũng là nơi bạn KHOE để khi gửi CV đi xin việc :D Chúc bạn ngày càng làm đầy kho github của mình Thân mến, ThiDK |
