Giao diện
Buổi 9 — Xuất bản website
Lesson 9 — Publishing the site · WebAI Builder
Guiding Question (Compelling)
Sản phẩm chỉ nằm trên máy của mình thì có phải là sản phẩm không?
Is a product that lives only on my computer really a product?
1. Learning Outcomes (Backward Design — bước 1)
| ID | Outcome | Performance Task trong khung / Framework task |
|---|---|---|
C4.3 | Xuất bản được website lên một địa chỉ truy cập công khai. Publish a website to a public address. | Học sinh triển khai website lên một URL hoặc domain, sau đó gửi link để mentor truy cập từ thiết bị khác. The learner deploys the site to a URL or domain, then sends the link so the mentor can open it from another device. |
Performance Task của buổi / Lesson performance task: Triển khai website lên một URL công khai và gửi link cho mentor mở từ thiết bị khác.
Deploy the site to a public URL and send it so the mentor opens it from another device.
2. Evidence & Assessment (bước 2)
2 bước đánh giá tổng kết (assess) · 16 màn hình · mọi tương tác đều ghi evidence.
2 summative steps · 16 screens · every interaction leaves evidence.
| Bước / Step | LO | Loại / Type | Nội dung / Prompt |
|---|---|---|---|
s13 | C4.3 | Liên kết/sản phẩm Link/artifact | Dán URL công khai của website em. |
s14 | C4.3 | Tự luận Text | Mở URL trên điện thoại hoặc thiết bị khác. Em thấy gì? Mentor có mở được không? |
3. Learning Plan — 120 phút (bước 3)
| Chặng / Phase | Phút | CRA | Hoạt động của mentor / Mentor activity | Màn hình / Screens |
|---|---|---|---|---|
| Gợi mở Wonder | 10 | C | Gửi file index.html qua tin nhắn; bạn mở thấy lỗi. Vì sao? Send index.html in a chat; a friend sees it broken. Why? | 3 |
| Khám phá Explore | 35 | C | Mentor dẫn nhóm nhờ Claude Code xuất bản lên Cloudflare Pages. Nhắc: trang công khai ai cũng xem được. Mentor guides groups to publish with Claude Code to Cloudflare Pages. Reminder: public pages are visible to everyone. | 5 |
| Biểu diễn Represent | 25 | R | Vẽ đường đi của website từ máy em tới thiết bị của mentor. Draw the site’s path from your laptop to the mentor’s device. | 2 |
| Khái quát Abstract | 20 | A | Giải thích “chạy trên máy mình” khác “xuất bản”. Explain “runs on my computer” vs “published”. | 2 |
| Thiết kế lại Redesign | 20 | A | Performance Task: gửi URL công khai, mentor mở từ thiết bị khác. Performance Task: send the public URL; the mentor opens it from another device. | 2 |
| Nhìn lại Reflect | 10 | A | Điều gì khiến em hồi hộp khi công khai sản phẩm? What makes you nervous about going public? | 2 |
4. IB
| Key concepts | Cộng đồng / Communities · Giao tiếp / Communication |
| Global context | Toàn cầu hóa & bền vững / Globalization & sustainability |
| ATL skills | Giao tiếp / Communication · Tự quản lý / Self-management |
| Learner profile | Dám thử / Risk-takers · Có nguyên tắc / Principled |
5. Vật liệu / Materials
- Tài khoản Cloudflare do mentor chuẩn bị
A Cloudflare account prepared by the mentor - Claude Code đã cài
Claude Code installed - Điện thoại để thử link
A phone to test the link
6. Màn hình học viên / Learner screens
Xem toàn bộ 16 màn hình / Show all 16 screens
| # | Chặng | Loại | Nội dung |
|---|---|---|---|
| 1 | Gợi mở | Thông tin | Em gửi file index.html cho bạn qua tin nhắn. Bạn mở ra và thấy mất ảnh, mất kiểu chữ. |
| 2 | Gợi mở | Chọn đáp án | Vì sao bạn không thấy giống em? |
| 3 | Gợi mở | Biểu mẫu nhiều ô | Trước khi chia sẻ website, em cần kiểm tra hai điều gì? |
| 4 | Khám phá | Thông tin | Xuất bản là đưa website lên một máy chủ có địa chỉ (URL) mà ai cũng mở được. Mentor hướng dẫn dùng Claude Code và Cloudflare Page… |
| 5 | Khám phá | Sắp thứ tự | Sắp xếp các bước xuất bản website. |
| 6 | Khám phá | Chọn đáp án | Địa chỉ nào mở được từ thiết bị khác? |
| 7 | Khám phá | Thông tin | Từ máy em tới người xem, dữ liệu đi qua nhiều chặng. Mỗi chặng đều cần cẩn trọng. |
| 8 | Khám phá | Thông tin | Trang công khai thì ai cũng xem được. Đừng đưa họ tên đầy đủ, địa chỉ, số điện thoại hay mật khẩu vào website. |
| 9 | Biểu diễn | Thông tin | Đường đi: Máy em, đẩy lên, máy chủ, URL công khai, thiết bị của mentor. |
| 10 | Biểu diễn | Chọn đáp án | Bước nào khiến người khác truy cập được? |
| 11 | Khái quát | Tự luận | Giải thích sự khác nhau giữa “chạy trên máy mình” và “xuất bản”. |
| 12 | Khái quát | Thông tin | Nói gọn: xuất bản là cho phép người khác mở sản phẩm bằng một URL. Tên miền riêng chỉ là mức nâng cao. |
| 13 ★ | Thiết kế lại | Liên kết/sản phẩm | Dán URL công khai của website em. |
| 14 ★ | Thiết kế lại | Tự luận | Mở URL trên điện thoại hoặc thiết bị khác. Em thấy gì? Mentor có mở được không? |
| 15 | Nhìn lại | Tự luận | Điều gì khiến em hồi hộp khi công khai sản phẩm? |
| 16 | Nhìn lại | Mức tự tin | Em tự tin xuất bản một website đến mức nào? |
★ = bước đánh giá tổng kết / summative step