Trang đã làm xong và đang mở trong trình duyệt. Nó trông giống một trang web, hoạt động như một trang web: liên kết bấm được, nút nhấn được. Bạn gửi trang cho ai đó, nhưng họ trả lời "không mở được". Hoặc mở được, nhưng không có style và hình ảnh. Không có gì bị hỏng. Trang chỉ sống ở đúng một nơi, trên ổ đĩa của bạn, và thanh địa chỉ của trình duyệt cho thấy điều đó - chỉ cần biết nhìn vào đâu.

Câu hỏi "làm sao đưa trang web lên internet" nghe như thể có một cái nút nào đó cần tìm. Hỏi cách khác sẽ có ích hơn: trang web phải sống ở đâu để không chỉ mình tôi thấy nó? Câu trả lời ghép dần từ nhiều phần: máy chủ, hai địa chỉ, đường dẫn, hosting và triển khai. Sau đó là cách cập nhật thứ đã đăng, vì sao hosting cần khóa và agent làm gì khi bạn nhờ nó "đưa lên".

1. Tệp tồn tại trên một máy tính

Hãy nhìn vào thanh địa chỉ khi trang được mở từ ổ đĩa. Ở đó không phải là liên kết, mà là đường dẫn đến tệp:

file:///C:/projects/landing/index.html    # đường dẫn đến tệp trên ổ đĩa của bạn
https://landing-demo.tiiny.site/          # địa chỉ trên một máy tính khác

Dòng đầu tiên là ổ đĩa của bạn. Ở đây trình duyệt chỉ đóng vai chương trình xem: mở tệp, đọc, hiển thị. Nó không hề đi ra mạng. Dòng thứ hai là địa chỉ của một máy tính khác. Dòng đầu tiên sẽ chỉ mở được trên máy tính của bạn, dòng thứ hai mở được từ bất kỳ thiết bị nào có kết nối Internet.

"Không mở được" bắt nguồn từ đây. Gửi một tệp và xuất bản một trang là hai việc khác nhau. Một trang thường không phải một tệp, mà là một thư mục: index.html, bên cạnh là style.css và hình ảnh. Bạn chỉ gửi mỗi index.html - người nhận mở được, nhưng style và hình ảnh thì không có chỗ nào để tìm. Thế là thành "mở được, nhưng hiển thị lệch lạc".

Và còn một giới hạn nữa, đơn giản hơn. Buổi tối bạn gập laptop, cho vào túi và mang về nhà. Vậy là nó ngủ, không phục vụ được cho ai cả. Để ai cũng thấy trang, lúc nào cũng thấy, các tệp của trang phải nằm ở chỗ khác chứ không phải ở máy bạn.

"Chạy được trên máy tôi" và "ai cũng mở được" là hai trạng thái khác nhau. Phần còn lại của bài viết nói về những gì nằm giữa hai trạng thái đó.

2. Máy chủ

Từ khóa là máy chủ. Đó không phải chiếc hộp bí ẩn nhấp nháy đèn, mà chỉ là một máy tính luôn bật và gửi tệp cho người khác. Toàn bộ ý nghĩa của nó là vậy: luôn trực tuyến khi bạn vắng mặt.

Tưởng như cũng có lúc không cần đến nó. Bạn gửi một bức ảnh cho bạn bè qua ứng dụng nhắn tin - chẳng phải nó bay thẳng từ điện thoại của bạn sang máy người kia sao? Không. Trước tiên nó đến máy chủ của ứng dụng nhắn tin, rồi từ đó mới đến bạn của bạn. Vì thế bạn có thể gửi xong, tắt điện thoại đi ngủ, còn bạn của bạn hai tiếng sau mới mở ra xem. Máy chủ nằm ở giữa ngay cả khi bạn không nhìn thấy nó.

Với trang web, kết luận cũng vậy: để ai cũng thấy trang, các tệp phải nằm trên một cái máy như thế. Internet không phải đám mây chung nơi mọi thứ tự bay vào, mà là một máy tính khác không bao giờ ngủ. Lúc đầu nghe điều này còn hơi thất vọng, đời thường quá. Nhưng bù lại thì dễ hiểu.

3. Tên miền và IP

Trên thế giới có rất nhiều máy chủ, và phải có cách nào đó để gọi đúng máy chủ mình muốn. Bằng địa chỉ. Một máy chủ có hai địa chỉ, giống như một ngôi nhà bình thường: tọa độ và biển hiệu.

IP là địa chỉ thứ nhất. Đó là một địa chỉ bằng số như 192.0.2.1: chính xác, nhưng con người khó đọc, chỉ là tọa độ trơ trọi. Các máy tính nói chuyện với nhau đúng theo cách này.

Tên miền là địa chỉ thứ hai. Đó là cái tên dành cho con người, như example.com. Đây là biển hiệu: bạn đâu có nói với bạn bè "gặp nhau ở tòa nhà có tọa độ năm mươi phẩy bốn lăm, ba mươi phẩy năm hai". Bạn nói "ở quán cà phê góc phố".

192.0.2.1        # IP: địa chỉ số của máy chủ, cho máy tính
example.com      # tên miền: cùng một nơi, với tên cho con người

Hai địa chỉ này liên hệ với nhau thế nào: khi bạn nhập tên, trình duyệt trước tiên hỏi danh bạ tên xem IP nào đứng sau cái tên đó, rồi mới đi theo dãy số. Danh bạ này gọi là DNS, và lúc này bạn không cần biết gì thêm về nó: bạn nhập tên, phần còn lại tự diễn ra.

Và còn một phần của địa chỉ rất dễ bị bỏ qua: https:// ngay ở đầu. Nó không thuộc về tên, mà là cách kết nối: cuộc trò chuyện với máy chủ được mã hóa. Các trình duyệt hiển thị điều này theo các cách khác nhau, nhưng http:// không có s được tất cả các trình duyệt đánh dấu là không an toàn. Phần mã hóa thì hosting tự lo.

4. Đường dẫn và tệp mặc định

Trên máy chủ thường có cả đống tệp. Cần đúng tệp nào thì đường dẫn (path) cho biết, đó là phần địa chỉ đứng sau tên miền. Nếu tên miền là tòa nhà, thì đường dẫn là quầy hàng nào bên trong.

Địa chỉ https://example.com/about/team.html được chia thành ba phần: cách kết nối, tên miền và đường dẫn đến tệphttps://example.com/about/team.htmlcách kết nốitệp nàochỗ này của ai
Địa chỉ là ba câu trả lời liên tiếp: cách kết nối, chỗ này của ai, tệp nào

Địa chỉ đọc từ trái sang phải, và nó không phải chuỗi ký tự thần bí nào cả, mà là ba câu trả lời. https://example.com/about/team.html có nghĩa là "trên máy chủ example.com hãy mở tệp about/team.html".

Đường dẫn thực chất là đường dẫn đến tệp trên ổ đĩa của máy chủ: thư mục about, trong đó có team.html, giống như đường dẫn đến thư mục trên máy tính của bạn. Trên các trang web lớn, các trang thường được tạo động, nhưng logic vẫn giống nhau: địa chỉ dẫn đến một nơi cụ thể.

Còn nếu đường dẫn trống thì sao? Bạn gõ https://example.com/ - mở tệp nào? Câu trả lời đã được quy ước từ lâu: máy chủ trả về index.html trong thư mục gốc của trang, gần như hosting nào cũng làm vậy. Từ đó ra một quy tắc sắp dùng đến: index.html nằm ở gốc của thư mục bạn xuất bản, chứ không nằm trong một thư mục con.

5. Toàn bộ lộ trình

Giờ thì đã đủ mọi phần, có thể ghép chúng thành một chuỗi.

  • Bạn nhập địa chỉ
  • Danh bạ tên
  • Máy chủ và đường dẫn
  • Trang hiện ra trước mắt bạn

Bạn nhập địa chỉ. Trình duyệt hỏi danh bạ tên xem tên miền ứng với IP nào, gọi đến máy chủ, máy chủ tìm tệp theo đường dẫn và gửi về. Trình duyệt nhận được đúng thứ văn bản HTML vốn cũng có thể nằm trên ổ đĩa của bạn, rồi vẽ ra trang.

Điểm chính ở đây: markup và style được trình duyệt vẽ như nhau, dù tệp đến từ ổ đĩa hay từ máy chủ. Khác nhau ở chỗ còn ai khác có thể lấy được tệp đó. Có điều, với trang mở từ ổ đĩa, trình duyệt hạn chế một phần khả năng của JavaScript, nên trên máy chủ đôi khi trang chạy đầy đủ hơn so với cùng trang đó mở cục bộ.

6. Hosting

Bạn không có máy chủ nào trong trung tâm dữ liệu, và cũng không cần. Đã có hosting - máy chủ đi thuê: bạn giao cho nó thư mục chứa trang, nó đặt thư mục lên máy chủ luôn bật của mình và trả lại một liên kết công khai. Thế thôi.

Liên kết sẽ nằm trên tên miền của hosting, còn tên của bạn đứng bên trái: landing-demo.tiiny.site, name.github.io. Tên miền thuộc về hosting, phần của bạn là cái tên đứng trước nó: có khi bạn tự chọn, có khi hosting tự cấp. Tên miền riêng như mysite.com cũng dùng được, nhưng chuyện mua và cấu hình nó để sau: muốn cho người khác xem trang thì chưa cần đến.

Với trang làm từ các tệp có sẵn, không cần chương trình chạy trên máy chủ (loại này gọi là trang tĩnh, đó là một chủ đề riêng), có cả hosting miễn phí. Bạn sẽ không phải trở thành quản trị viên hệ thống.

Agent cũng làm được việc này

Agent có thể tự giao thư mục cho hosting: bằng một lệnh hoặc qua một skill có sẵn, tức là bản hướng dẫn cho một hosting cụ thể. Khi đó agent làm gì và sẽ hỏi gì - xem ở cuối bài.

7. Triển khai

Và giờ là từ mà cả bài viết hướng tới. Triển khai (deploy): bạn sao chép các tệp của mình đến nơi không chỉ mình bạn truy cập được, tức là từ ổ đĩa của bạn lên máy chủ của hosting. Thư mục vẫn ở chỗ bạn, và đồng thời xuất hiện ở đó.

Trước khi triển khai, thư mục landing chỉ nằm trên máy tính của bạn, sau khi triển khai, bản sao của nó nằm trên máy chủ hosting và nó có một liên kếtlanding/index.html, style.cssimg/hero.pnglanding/index.html, style.cssimg/hero.pnglanding-demo.tiiny.siteLiên kếtMáy tính của bạnMáy chủ hostingtriển khai
Triển khai là sao chép, không phải chuyển đi: thư mục vẫn ở chỗ bạn và xuất hiện thêm trên một máy chủ có địa chỉ

Sau khi triển khai, cùng một thư mục nằm ở hai nơi, và liên kết dẫn đến bản bên phải. Bản bên trái vẫn còn nguyên, bạn cứ tiếp tục làm việc với nó.

Chính xác thứ gì được gửi lên:

landing/
  index.html
  style.css
  img/
    hero.png

Cả thư mục landing/ được xuất bản, nên style.css và hình ảnh vẫn nằm cạnh index.html và được tìm thấy theo đúng những đường dẫn cũ. Còn index.html nằm ở gốc của thư mục này. Nếu bạn xuất bản thư mục cao hơn một cấp, mở liên kết ra sẽ chỉ thấy danh sách thư mục hoặc trang trống.

Thư mục lên máy chủ bằng cách nào thì mỗi hosting một kiểu. Cách làm tay đơn giản nhất: mở trang web của hosting, kéo thư mục hoặc tệp nén vào đó và nhấn nút triển khai. Ngoài ra còn có cách dùng lệnh trong terminal và cách qua repository. Bản chất vẫn là một: bản sao thư mục của bạn trên máy chủ của họ. Cách làm còn tùy vào ai triển khai: bạn thì dùng được trang web, còn agent chỉ dùng được lệnh.

Có hai từ từ đây trở đi sẽ gặp liên tục. Cục bộ (local) - trên máy của bạn, chỉ cho riêng bạn. Công khai - trên máy chủ, cho tất cả mọi người. Triển khai là cây cầu nối hai bên, và nó ngắn hơn bạn tưởng: một thư mục và một bản sao của nó.

Kiểm tra liên kết từ một thiết bị khác

Trên chính máy tính chứa thư mục, trang kiểu gì cũng mở được, nên chẳng chứng minh được điều gì: rất dễ vô tình mở tệp cục bộ mà không để ý. Cách kiểm tra đáng tin là dùng điện thoại với mạng di động: nó chẳng có liên hệ gì với laptop của bạn, và nếu ở đó mở được, nghĩa là trang đã thực sự công khai.

8. Cách cập nhật nội dung đã đăng

Bạn sửa tiêu đề trong index.html, tải lại trang trên điện thoại - vẫn là bản cũ. Đúng là phải như vậy. trên hosting là bản sao từ lúc triển khai, còn bạn đã sửa bản gốc. Muốn liên kết hiện nội dung mới thì phải gửi thư mục lên lần nữa: cập nhật chính là triển khai lại.

Ở đây có một chỗ tinh tế. Gửi lại lên đúng địa chỉ cũ chỉ được khi hosting nhận ra bạn. Vì thế mới có hai loại liên kết.

Tạm thời. Một số hosting cấp liên kết mà không cần tài khoản, để cho người khác xem và góp ý. Liên kết này sống không lâu: ví dụ ở Tiiny Host là khoảng một giờ. Ngay cả với loại này hosting vẫn có thể hỏi email, đó không phải là đăng ký, mà là cách gắn lượt tải lên với một thứ gì đó. Liên kết như vậy không cập nhật được, chỉ có thể đăng lại thư mục dưới một địa chỉ mới.

Cố định. Có tài khoản thì liên kết không biến mất, địa chỉ có thể tự chọn, cập nhật và xóa; gói miễn phí thường giới hạn số trang web và số lần cập nhật. Tài khoản miễn phí có ngay trên chính những hosting cấp liên kết tạm thời. Cùng với tài khoản sẽ có thêm một khóa, nhưng không phải lúc nào cũng cần đến nó.

Nếu agent làm việc triển khai, lần đầu và lần cập nhật chỉ khác nhau ở một câu:

Đưa thư mục landing lên hosting. Tôi cần một liên kết mở được từ điện thoại.

Tôi đã sửa tiêu đề trong index.html. Đưa landing lên lại, vào đúng địa chỉ cũ nếu được.

Yêu cầu thứ hai là yêu cầu thành thật. "Nếu được" để agent tự xử lý chuyện liên kết tạm thời hay cố định, và nó sẽ nói kết quả là loại nào. Câu trả lời của agent tôi không đưa ra đây: mỗi hosting và mỗi skill trả lời một kiểu.

9. Khóa truy cập

Tài khoản trên hosting cho bạn một khóa truy cập: một chuỗi dài gồm chữ cái và chữ số, nhờ nó hosting nhận ra bạn. Khi làm bằng tay thì không cần khóa: bạn đã đăng nhập tài khoản trên trang web, kéo thư mục vào, nhấn triển khai - hosting vốn đã biết bạn là ai. Người cần khóa là agent: nó không đi qua trang web, nó gửi thư mục bằng lệnh, mà lệnh thì hosting chỉ nhận ra qua khóa. Có khóa, lần triển khai sẽ đặt tệp vào địa chỉ cố định của bạn; không có khóa thì chỉ được liên kết tạm thời.

Không dán khóa vào nội dung tin nhắn

Ai giữ khóa thì người đó đăng bài dưới danh nghĩa của bạn, giống như chìa khóa căn hộ bị bỏ quên ngoài đường. Cuộc hội thoại với agent được lưu trên ổ đĩa và được gửi qua mạng, nên không dán khóa vào đó, kể cả khi agent yêu cầu.

Khóa có chỗ riêng của nó, nơi các công cụ tự đọc được: một biến môi trường hoặc một tệp mà skill triển khai tự mở, không cần đến bạn. Nếu skill hỏi lưu khóa ở đâu, hãy trả lời bằng vị trí đó, chứ không phải bằng một chuỗi ký tự trong chat.

Cũng có trường hợp ngược lại: khóa tự xuất hiện trong cuộc hội thoại, là câu trả lời của dịch vụ cho yêu cầu của agent. Khi đó hãy lưu nó vào đúng chỗ ấy và nhớ rằng cuộc hội thoại đã nhìn thấy bí mật này rồi.

Lần xuất bản đầu tiên không cần khóa: liên kết tạm thời hoặc tải lên qua trang web là đủ.

10. Điều này vận hành thế nào khi làm cùng Claude Code

Khi bạn nhờ agent "đưa lên", mọi chuyện diễn ra đại khái như sau.

  • Agent xem thư mục và thấy đó là một trang làm từ các tệp có sẵn. Nếu chưa có skill cho hosting, nó sẽ đề nghị cài hoặc hỏi đưa lên đâu. Hosting do bạn chọn.
  • Việc gửi đi được agent làm bằng lệnh. Ở các chế độ mà agent xin phép, lệnh hiện ra trước khi chạy: trong đó ghi rõ thư mục nào được gửi và gửi đi đâu, và nên đọc nó, chứ đừng bấm "có" theo quán tính. Nếu agent không xin xác nhận (những chế độ như vậy có tồn tại và có thể được bật ngay từ đầu), hãy yêu cầu nó cho xem lệnh và thư mục trước khi gửi.
  • Kết quả là một liên kết trong câu trả lời của agent. Hãy mở nó trên điện thoại: agent không có thiết bị thứ hai, tự nó không kiểm tra được việc này.
  • Cập nhật cũng là yêu cầu y như vậy, "đưa lên lại". Đúng địa chỉ cũ chỉ được khi hosting nhận ra bạn qua khóa. Nếu không, agent sẽ thành thật trả về một liên kết tạm thời mới, và đó không phải là lỗi.
  • Agent có thể hỏi email cho liên kết tạm thời, đó không phải bí mật. Còn khóa thì không: nếu agent hỏi, câu trả lời là nơi có thể đọc khóa, chứ không phải chuỗi ký tự trong chat.
Đọc xem trong lệnh là thư mục nào

Đó phải là thư mục của trang, không phải cả ổ đĩa, không phải thư mục chứa khóa và cũng không phải bản nháp. Xóa trang khỏi hosting cũng là một lệnh, và nên nhìn thấy nó trước khi chạy vì đúng lý do ấy.