Xuất bản trang web của bạn

Các lựa chọn là gì?

Xuất bản một trang web là chủ đề phức tạp vì có nhiều cách để thực hiện. Bài viết này không cố gắng ghi lại tất cả các phương pháp có thể. Thay vào đó, nó giải thích ưu và nhược điểm của ba phương pháp thực tế cho người mới bắt đầu. Sau đó nó hướng dẫn qua một phương pháp có thể hoạt động ngay lập tức cho nhiều độc giả.

Mua lưu trữ web và tên miền

Để có thêm quyền kiểm soát nội dung và giao diện trang web, hầu hết các chuyên gia/doanh nghiệp chọn mua lưu trữ web (web hosting) và tên miền (domain name):

• Lưu trữ web là không gian tệp được thuê trên máy chủ web của một công ty lưu trữ. Bạn đặt các tệp trang web lên máy chủ web. Máy chủ web cung cấp nội dung trang web cho khách truy cập.
• Tên miền là địa chỉ web duy nhất nơi mọi người tìm thấy trang web của bạn, chẳng hạn như https://www.mozilla.org hoặc https://www.bbc.co.uk. Bạn có thể thuê tên miền của mình trong bao nhiêu năm tùy ý từ một nhà đăng ký tên miền (domain registrar).

Nếu bạn mua lưu trữ web và tên miền từ cùng một công ty, chúng thường được cấu hình tự động để kết nối với nhau. Tuy nhiên, nếu bạn mua chúng từ các công ty riêng biệt, hoặc muốn chuyển lưu trữ sang công ty khác, bạn cần thực hiện một chút cấu hình để trỏ tên miền đến máy chủ đúng. Điều này để mọi người sẽ thấy trang web của bạn khi họ điều hướng đến địa chỉ web đó. Điều này thường được thực hiện bằng cách đăng nhập vào trang web của nhà đăng ký tên miền và đặt nameserver của tên miền thành những nameserver do công ty lưu trữ cung cấp.

Các công ty sử dụng nhiều cơ chế khác nhau để chuyển tệp lên máy chủ web. Nhiều công ty sẽ có nhiều hơn một tùy chọn; các tùy chọn điển hình bao gồm:

• Giao diện kéo và thả (bạn sẽ thấy ví dụ về điều này trong Xuất bản qua GitHub, phần tiếp theo).
• Chương trình File Transfer Protocol (FTP) (Giao thức truyền tệp). Các chương trình FTP khác nhau rất nhiều, nhưng nhìn chung, bạn phải kết nối với máy chủ web bằng các thông tin chi tiết do công ty lưu trữ cung cấp (thường là tên người dùng, mật khẩu, tên máy chủ). Sau đó chương trình hiển thị các tệp cục bộ và tệp trên máy chủ web trong hai cửa sổ và cung cấp cách để bạn chuyển tệp qua lại.
• Giữ mã nguồn trang web trong kho lưu trữ GitHub (xem bên dưới) và cấp cho công ty lưu trữ quyền truy cập để họ có thể lấy nguồn, xây dựng nếu cần và xuất bản nó.
• Một số công ty sẽ cung cấp công cụ dòng lệnh để bạn sử dụng để chuyển tệp.

Mẹo tìm lưu trữ và tên miền

• MDN không quảng bá các công ty lưu trữ thương mại hoặc nhà đăng ký tên miền cụ thể. Để tìm công ty lưu trữ và nhà đăng ký, chỉ cần tìm kiếm "web hosting" và "domain names". Tất cả các nhà đăng ký sẽ có tính năng cho phép bạn kiểm tra xem tên miền bạn muốn có sẵn không.
• Nhà cung cấp dịch vụ internet (ISP) tại nhà hoặc văn phòng của bạn có thể cung cấp dịch vụ lưu trữ hạn chế cho một trang web nhỏ. Bộ tính năng sẵn có sẽ bị hạn chế, nhưng nó có thể hoàn hảo cho các thử nghiệm đầu tiên của bạn.
• Cũng có các dịch vụ miễn phí như Neocities, Google Sites và WordPress. Các dịch vụ này có thể bị giới hạn về phạm vi, nhưng đủ tốt cho các thử nghiệm ban đầu.

Sử dụng công cụ trực tuyến

Một số công cụ cho phép bạn xuất bản trang web trực tuyến:

• GitHub là trang "lập trình xã hội" (social coding). Nó cho phép bạn tải lên kho lưu trữ mã để lưu trữ trong hệ thống kiểm soát phiên bản (version control system) Git. Sau đó bạn có thể cộng tác trên các dự án mã, và hệ thống là mã nguồn mở theo mặc định, có nghĩa là bất kỳ ai trên thế giới cũng có thể tìm thấy mã GitHub của bạn, sử dụng nó, học từ nó và cải thiện nó. GitHub có một tính năng rất hữu ích gọi là GitHub Pages, cho phép bạn hiển thị mã trang web trực tiếp trên web.
• Netlify là nền tảng lưu trữ web cung cấp lưu trữ cho các trang web tĩnh trực tiếp từ kho GitHub của bạn. Nó cũng cung cấp một số tính năng bổ sung, chẳng hạn như xem trước triển khai, hàm serverless và xử lý biểu mẫu.
• Fly.io là nền tảng cho phép bạn triển khai ứng dụng và cơ sở dữ liệu gần người dùng của bạn. Điều này phù hợp hơn nếu bạn có ứng dụng web yêu cầu dịch vụ backend.

Các tùy chọn này thường miễn phí, với bộ tính năng hạn chế.

Sử dụng IDE dựa trên web như CodePen

Có một số ứng dụng web mô phỏng môi trường phát triển trang web, cho phép bạn viết HTML, CSS và JavaScript, sau đó được hiển thị và hiển thị trong ngăn đầu ra. Nhìn chung, các công cụ này dễ sử dụng, tốt cho học tập, tốt để chia sẻ mã (ví dụ: nếu bạn muốn chia sẻ kỹ thuật hoặc yêu cầu trợ giúp gỡ lỗi từ đồng nghiệp ở văn phòng khác) và miễn phí (cho các tính năng cơ bản). Chúng lưu trữ trang được hiển thị của bạn tại một địa chỉ web duy nhất. Tuy nhiên, các tính năng bị hạn chế và các ứng dụng này thường không cung cấp không gian lưu trữ cho các tài nguyên (như hình ảnh).

Hãy thử dùng một số ví dụ này để tìm ra cái nào phù hợp nhất với bạn:

• Scrimba ^{MDN learning partner}
• JSFiddle
• JSBin
• CodePen

Xuất bản qua GitHub

Bây giờ hãy xem cách xuất bản trang web của bạn qua GitHub Pages.

1. Trước tiên, đăng ký GitHub và xác minh địa chỉ email của bạn.

2. Tiếp theo, bạn cần tạo một kho lưu trữ để lưu trữ tệp. Trên trang này:

   1. Trong hộp Repository name (Tên kho lưu trữ), nhập username.github.io, trong đó username là tên người dùng của bạn. Ví dụ: người bạn của chúng tôi là Bob Smith sẽ nhập bobsmith.github.io.
   2. Nhấp vào nút Create repository (Tạo kho lưu trữ) ở cuối trang.

3. Trên trang tiếp theo, tìm liên kết uploading an existing file (tải lên tệp hiện có) và nhấp vào đó. Thao tác này sẽ đưa bạn đến trang tải lên tệp.

4. Tại thời điểm này, bạn sẽ có thể kéo và thả tệp từ hệ thống tệp cục bộ lên trang web để tải chúng lên kho lưu trữ GitHub. Để thực hiện:

   1. Mở cửa sổ trình khám phá tệp/finder trên máy tính của bạn.
   2. Đảm bảo bạn có thể thấy cả cửa sổ trình khám phá tệp và cửa sổ trình duyệt web — đặt chúng cạnh nhau trên màn hình của bạn.
   3. Điều hướng cửa sổ trình khám phá tệp đến thư mục chứa trang web mẫu của bạn.

      Note: Đảm bảo thư mục của bạn có tệp index.html.

   4. Chọn tất cả các tệp của trang web mẫu (ví dụ: sử dụng phím tắt bàn phím Ctrl + A, hoặc Cmd + A trên macOS).
   5. Kéo các tệp từ trình khám phá tệp qua phần "Drag files here to add them to your repository" (Kéo tệp vào đây để thêm vào kho lưu trữ) của trang GitHub.
   6. Đường viền và văn bản của phần thay đổi để cho biết có thể thả tệp. Hãy thả các tệp ở thời điểm này.
   7. Nhấp vào nút Commit changes (Xác nhận thay đổi) ở cuối trang.

5. Điều hướng trình duyệt của bạn đến username.github.io để xem trang web của bạn trực tuyến. Ví dụ: với tên người dùng chrisdavidmills, hãy truy cập chrisdavidmills.github.io.

   Note: Có thể mất vài phút để trang web của bạn hoạt động. Nếu trang web của bạn không hiển thị ngay lập tức, hãy đợi vài phút và thử lại.

Để tìm hiểu thêm, hãy xem GitHub Pages Help.

Đọc thêm

• Máy chủ web là gì
• Tìm hiểu về tên miền
• Chi phí để làm gì đó trên web là bao nhiêu?
• Deploy a Website: Một hướng dẫn hay từ Codecademy đi sâu hơn và hiển thị một số kỹ thuật bổ sung.

• Previous
• Overview: Trang web đầu tiên của bạn
• Next