บทเรียน 08 — ระบบหลังบ้าน /admin จัดการสถานที่และข้อความติดต่อ

ขั้นสุดท้ายของ session: เปลี่ยนเว็บ “แก้ได้เฉพาะตอนสั่ง AI” ให้เป็นเว็บที่เจ้าของบริหารเองได้ — ระบบหลังบ้านที่ /admin สำหรับจัดการข้อมูลสถานที่ท่องเที่ยว (รวมรูปภาพ) ดูข้อความจาก contact form และจัดการ user ของระบบหลังบ้าน จบด้วยการ deploy ขึ้นโดเมนที่ผูกไว้

เป้าหมายของบทนี้: ได้หลังบ้านครบสามส่วน และปิด workshop ด้วย checklist ความปลอดภัยก่อนเว็บออกสู่โลกจริง

Prompt ที่ใช้

session จริงส่งรหัสผ่าน default ไปใน prompt ตรง ๆ — ในบทเรียนนี้เราปิดบังรหัสและใช้สูตรเดิมกับรหัสของคุณเองแทน (เหตุผลอยู่ในกล่องเตือนด้านล่าง)

ต้องการระบบบริหารจัดการหลังบ้าน /admin ที่จะใช้ในการจัดการข้อมูลสถานที่ท่องเที่ยว ซึ่งจะต้องใส่ข้อมูลที่เป็นรูปภาพแล้วก็ข้อมูลของสถานที่ท่องเที่ยวได้ และส่วนที่ดูว่ามีใครกรอก Contact form มาบ้าง โดยระบบหลังบ้านให้มีระบบจัดการ user ด้วย และต้องการให้มีดีฟอลต์ยูเซอร์สำหรับการใช้งานก็คือ admin / (รหัสถูกปิดบัง — ตั้งรหัสของตัวเองเสมอ) ถ้าเสร็จแล้ว deploy ได้เลย.

prompt นี้กำหนดความต้องการเป็นสามก้อนชัดเจน — (1) จัดการข้อมูลสถานที่ + รูปภาพ (2) ดูข้อความจาก contact form (3) จัดการ user พร้อมบัญชี default — และปิดท้ายด้วยคำสั่ง deploy เลย เมื่อความต้องการชัด เท่านี้ก็พอให้ agent ออกแบบระบบได้ทั้งหมด

อย่าวางรหัสผ่านจริงใน prompt — prompt และบทสนทนาถูกเก็บ ส่งต่อ และนำมาสอนกันได้ (บทเรียนชุดนี้ก็มาจาก session จริง) ให้ตั้งรหัสผ่านหลังจากระบบพร้อม หรือใช้ตัวแปรสภาพแวดล้อม/secret แล้วเปลี่ยนทันทีหลัง login ครั้งแรก

ผลลัพธ์

agent ทำงานยาวนานที่สุดของ session — 22 นาที 32 วินาที — แก้ไฟล์ถึง 42 ไฟล์ (+427 บรรทัด) แล้ว deploy ขึ้นโดเมนที่ผูกไว้ในบท 07

สิ่งที่ได้เพิ่มบนเว็บที่ lay-pai-gun.rawinlab.com:

Checklist ความปลอดภัยก่อนใช้งานจริง

ระบบหลังบ้านคือประตูที่มีค่าที่สุดของเว็บ — เช็กสามข้อนี้เสมอ ก่อนและหลัง deploy ทุกครั้ง:

เพิ่มเติมสำหรับระบบที่โตขึ้น: เปิด two-factor authentication ถ้าผู้ให้บริการรองรับ และแยกบัญชีผู้ใช้เป็นรายคนแทนการใช้บัญชี admin ร่วมกันหลายคน

สรุปท้าย workshop: สิ่งที่ได้และสิ่งที่ควรฝึกต่อ

เมื่อทำครบ 9 ขั้น คุณมีในมือ:

• เว็บไซต์จริงบนโดเมนของตัวเอง พร้อม hero, ระบบค้นหา 20 สถานที่ ไทย–อังกฤษ, ฟอร์มติดต่อที่ส่งถึงอีเมลจริง, การ์ดพร้อมภาพจริงและเครดิต และหลังบ้าน /admin
• กระบวนการทำงานกับ AI agent ที่ทำซ้ำได้: เตรียมเครื่องมือ (skills) → สั่งด้วย prompt ที่มีบริบท → รอจุดที่ agent ต้องถามกลับ → ตรวจผลจริงทุกขั้น → รักษาความปลอดภัยของสิ่งที่ agent แตะไม่ได้ (อีเมล โดเมน token รหัสผ่าน)
• ต้นแบบ prompt 9 ชุด ที่คัดลอกไปปรับกับธุรกิจของคุณได้ทันที

สิ่งที่ควรฝึกต่อ:

1. เปลี่ยนที่นั่งคนขับ — ลองสร้างเว็บหัวข้อที่คุณสนใจจริงด้วย prompt ชุดเดียวกัน แล้วสังเกตจุดที่คุณต้องเสริมบริบทเพิ่มจากตัวอย่างนี้
2. ฝึกอ่านผลตรวจและผลทดสอบ — ลองตั้ง acceptance criteria ง่าย ๆ ก่อนสั่งงาน (เช่น “ค้นหาไทย–อังกฤษได้ กรองจังหวัดได้ ฟอร์มเก็บข้อความสำรอง”) แล้วตรวจทุกข้อเอง
3. ทำความรู้จัก Cloudflare ให้ลึกขึ้น — ต่อยอดจาก static site ไปสู่ Workers, D1 และระบบที่มีข้อมูลจริง

ย้อนดูภาพรวมทั้ง 9 ขั้นได้ที่ บท 00 — ภาพรวม และเปิดผลงานจริงที่ lay-pai-gun.rawinlab.com