Todo List ที่พร้อมใช้จริง
จาก Prompt เดียว → ไฟล์ HTML → URL ใช้งานจริง · หลักฐาน UI + HTTP ครบ
โปรแกรมนี้ทำอะไรได้
เพิ่ม ลบ ติ๊กเสร็จ กรองงาน ดูความคืบหน้า เรียงลำดับ และจำข้อมูลหลังรีโหลด
- เพิ่ม ลบ และเปลี่ยนสถานะงาน
- กรองทั้งหมด / ยังไม่เสร็จ / เสร็จแล้ว
- คำนวณความคืบหน้าและจำข้อมูลด้วย localStorage
- ลากเรียงลำดับและรองรับจอ 390px
📋 Prompt ที่ใช้จริง
ข้อความที่ส่งเข้า MiniMax Agent task 418198498103393 · บันทึกจากงานจริง · มีหลักฐานต้นทาง
✓ Prompt นี้มีหลักฐานต้นทางและ task ID จริง จึงระบุว่า "ใช้จริง" ได้
🔁 Workflow แบบละเอียด (6 ขั้น)
จาก Prompt หนึ่งก้อน → ไฟล์ deploy-จริง ทุกขั้นมีหลักฐานภาพ
เตรียมคำสั่ง
ก๊อป Prompt Todo Lv.5 จากหน้า Prompt ของ VibeCode 101 โดยข้อความต้นทางและข้อความที่ส่งมี SHA-256 ตรงกัน
ส่งเข้า Agent
วาง Prompt ทั้งก้อนใน MiniMax Agent task 418198498103393 แล้วเริ่มสร้าง single-file HTML
ตรวจไฟล์
รอบแรกขึ้น Request failed จึงไม่นับผ่าน · กด Retry แล้วรอจน Agent สร้าง /workspace/todo-app.html สำเร็จ
สั่ง Deploy
สั่ง deploy ไฟล์เดิมไปยัง public CDN ของ MiniMax Space และกำหนดชื่อโปรเจกต์ todo-real-use-vibecode
เปิด URL
เปิด https://hudhly0wo1ot.space.minimax.io/ แยกจากหน้า Agent และตรวจชื่อหน้า เนื้อหา และสถานะของโปรแกรมจริง
ทดสอบและบันทึกหลักฐาน
ทดสอบ desktop และ mobile พร้อมเก็บ HTTP request/response/timing แล้วผูกหลักฐานด้วย pair_id เดียวกัน
📦 หลักฐานจาก MiniMax
ทุกหลักฐานเก็บมาจาก task จริง · URL สาธารณะเปิดตรวจได้
และแสดง Progress 33%
ส่วนควบคุมใช้งานได้
ขอบเขตหลักฐาน: ภาพ Agent ครอปพื้นที่บัญชีและงานอื่นออกเพื่อความเป็นส่วนตัว · ภาพผลลัพธ์มาจาก URL สาธารณะที่เปิดทดสอบจริง
🧪 วิธีทดสอบหน้าเว็บจริง
เปิด URL สาธารณะ แยกจากหน้า Agent แล้วทำตามลำดับนี้ · จากนั้นรีโหลดและตรวจ viewport มือถือ
- เพิ่มงานผ่านช่อง New task: เพิ่ม 3 รายการสำเร็จ
- ติ๊กเสร็จและคำนวณความคืบหน้า: Completed 1/3 และ Progress 33%
- Filter: Active 2 รายการ และ Completed 1 รายการ
- localStorage: รีโหลดแล้วยังคง 3 งานและเสร็จ 1 งาน
- Drag & drop: ลำดับงานเปลี่ยนจริง
- Responsive: 390 × 844 และไม่มี horizontal overflow
✅ ผล UI + HTTP
ตรวจครบทุกข้อ → ได้ PASS ทั้งหมด
| สิ่งที่ตรวจ | ผลที่สังเกต | Verdict |
|---|---|---|
| เพิ่มงานผ่านช่อง New task | เพิ่ม 3 รายการสำเร็จ | PASS |
| ติ๊กเสร็จ + คำนวณความคืบหน้า | Completed 1/3 และ Progress 33% | PASS |
| Filter | Active 2 รายการ และ Completed 1 รายการ | PASS |
| localStorage | รีโหลดแล้วยังคง 3 งานและเสร็จ 1 งาน | PASS |
| Drag & drop | ลำดับงานเปลี่ยนจริง | PASS |
| Responsive | 390 × 844 และไม่มี horizontal overflow | PASS |
📡 HTTP Evidence
🔧 RCA และข้อจำกัด
รอบแรก MiniMax Agent แสดง Request failed
หน้า Agent หยุดก่อนสร้างไฟล์เสร็จ จึงจัดรอบนั้นเป็น FAIL ไม่ใช่ผลสำเร็จ
Corrective plan: ใช้ Retry ใน task เดิมเพื่อรักษาบริบท แล้วตรวจว่ามีไฟล์และ URL จริงก่อนเริ่มทดสอบ
เรียนรู้เพิ่ม
อยากลองทำเอง · ไป Workshop #1