Vibe Coding ด้วย AI Agent: จากแอป Todo สู่ผลิตภัณฑ์ของคุณเอง

ทำความรู้จักคำสัญญาของคอร์ส เส้นทางการเรียน ชุดเครื่องมือ ค่าใช้จ่าย และแนวคิดการนำวิธีไปใช้กับผลิตภัณฑ์ของคุณ ก่อนเริ่มทำงานจริงใน Lovable

1. สิ่งที่คุณจะสร้างได้🔒7 นาที
2. เส้นทางการเรียนและคำสัญญาในการต่อยอด🔒12 นาที
3. เครื่องมือที่เราใช้🔒20 นาที
4. Lovable แบบฟรีหรือแบบชำระเงิน🔒10 นาที
5. ใช้จำนวนคำขอ AI Agent ให้คุ้มค่า🔒5 นาที
6. ไอเดียผลิตภัณฑ์ของคุณ🔒15 นาที

สร้างแอป Todo ที่ทำงานในเบราว์เซอร์รุ่นแรกด้วย Lovable พร้อมฝึกกำหนดขอบเขต PRD, Project Knowledge, Plan mode การตรวจงาน การแก้ไข checkpoint และ rollback

1. เอกสารสรุปการสร้างครั้งแรกแบบจำกัดขอบเขต🔒15 นาที
2. PRD และ Project Knowledge🔒20 นาที
3. Plan Mode และทิศทางด้านภาพ🔒10 นาที
4. ตรวจผลงานที่สร้างครั้งแรก🔒20 นาที
5. วงจรแก้ไขครั้งแรก🔒30 นาที
6. ฝึก Checkpoint และ Rollback🔒12 นาที

เพิ่มการบันทึกข้อมูลในเบราว์เซอร์ให้แอป Todo แล้วทดสอบพฤติกรรมหลัง refresh และปัญหา localStorage ที่พบบ่อย

1. ทำไม localStorage จึงสำคัญ🔒10 นาที
2. สร้าง localStorage🔒35 นาที
3. ทดสอบ localStorage ด้วยตนเอง🔒20 นาที
4. ทำอย่างไรเมื่อ localStorage มีปัญหา🔒25 นาที

ฝึกกู้คืนจากงานนอกขอบเขต วงจรที่ติดขัด API ที่ถูกแต่งขึ้น การเปลี่ยนแปลงที่ทำให้ระบบเสีย และ error ที่เข้าใจยาก ก่อนแอปจะซับซ้อนขึ้น

1. Lovable เปลี่ยนสิ่งที่ฉันไม่ได้ขอ🔒18 นาที
2. Lovable ทำซ้ำหรือแต่ง API ขึ้นมา🔒18 นาที
3. เมื่อ Rollback ดีกว่าการแก้ต่อ🔒12 นาที
4. อ่าน Error โดยไม่ต้องอ่านโค้ด🔒20 นาที

สร้างฟีเจอร์ frontend ด้วยคำแนะนำที่ลดลง วางสถานะ UX ในจุดที่ทดสอบได้ และสร้างส่วนแรกของผลิตภัณฑ์ของคุณ

1. ตัวกรองและสถานะว่าง🔒35 นาที
2. แก้ไขงานด้วย Prompt ของคุณเอง🔒40 นาที
3. ลำดับความสำคัญและการย้ายข้อมูล🔒45 นาที
4. วันครบกำหนด การค้นหา และสถานะไม่พบผลลัพธ์🔒45 นาที
5. Mobile UX และ Regression🔒20 นาที
6. หมุดหมาย: ส่วนแรกของผลิตภัณฑ์คุณ🔒45 นาที

จัดโครงสร้างแอป Todo ทีละส่วนโดยคงพฤติกรรมเดิมไว้ด้วยการตรวจ regression

1. เมื่อใด Refactoring จึงคุ้มค่า🔒15 นาที
2. แยก Utility ของ Task🔒30 นาที
3. แยก Adapter สำหรับ localStorage🔒30 นาที

เชื่อมจาก browser storage ไปสู่ข้อมูลระยะไกล ทำความเข้าใจ async, loading/error และโมเดลข้อมูลของผลิตภัณฑ์คุณ

1. จาก localStorage สู่ข้อมูลระยะไกล🔒15 นาที
2. โมเดลข้อมูลของผลิตภัณฑ์คุณ🔒20 นาที
3. Brief สำหรับย้าย Todo ไปฐานข้อมูล🔒20 นาที

สร้างโปรเจกต์ Supabase วางแผน migration สร้าง table tasks และเชื่อมการอ่านเขียนข้อมูลระยะไกลจริง

1. สร้าง Supabase ตั้งแต่ต้น🔒30 นาที
2. สร้าง Table tasks ด้วย Lovable🔒35 นาที
3. โหลด Task จากฐานข้อมูล🔒35 นาที
4. เชื่อม Create, Update และ Delete🔒40 นาที

เพิ่ม login เชื่อม task กับผู้ใช้ และทดสอบพฤติกรรมด้วยผู้ใช้สองคนก่อนเปิดการบังคับใช้ความเป็นส่วนตัว

1. ทำไมจึงต้องมี Login🔒10 นาที
2. เพิ่ม Auth UI🔒40 นาที
3. ทดสอบด้วยผู้ใช้สองคน🔒20 นาที

เปลี่ยน ownership ของ task ให้เป็นความเป็นส่วนตัวจริงในฐานข้อมูลด้วย RLS การ debug และการทดสอบผู้ใช้สองคน

1. ทำไมการกรองใน Frontend จึงไม่พอ🔒12 นาที
2. สร้าง RLS Policy🔒35 นาที
3. Debug RLS เมื่อบล็อก Row ของคุณ🔒30 นาที
4. ทดสอบ Auth และ Access Error🔒25 นาที

เชื่อม GitHub เตรียม environment variable, deploy ไป Vercel และ smoke-test แอปจริงหลังมี security

1. Deployment หมายถึงอะไร🔒12 นาที
2. สร้าง GitHub ตั้งแต่ต้น🔒25 นาที
3. เตรียมโปรเจกต์สำหรับ Deployment🔒20 นาที
4. Environment Variable🔒20 นาที
5. Deployment ครั้งแรก🔒35 นาที
6. Production Smoke Test🔒20 นาที

เก็บรายละเอียดแอป Todo ทำ regression รอบสุดท้าย เขียนเอกสารส่งมอบผลงาน และระบุสิ่งที่ Todo ยังไม่ได้สอน

1. ปรับ UX ขั้นสุดท้าย🔒25 นาที
2. Regression Checklist รอบสุดท้าย🔒25 นาที
3. README และคำอธิบาย Portfolio🔒25 นาที
4. สิ่งที่ Todo ยังไม่ได้สอน🔒12 นาที

ใช้ Build Notes ที่สะสมมาเพื่อต่อยอดส่วนแรกของผลิตภัณฑ์ แล้วจบด้วยสูตรที่นำกลับมาใช้ได้และแผนที่เครื่องมือ

1. ประกอบ PRD ของคุณ🔒25 นาที
2. Prompt กลางสำหรับฟีเจอร์หรือผลิตภัณฑ์ใหม่🔒15 นาที
3. ฟีเจอร์แรกของผลิตภัณฑ์ตั้งแต่ต้นจนจบ🔒45 นาที
4. ดัชนีสูตรและฟีเจอร์ถัดไป🔒20 นาที
5. เมื่อ Lovable ไม่พอ: แผนที่เครื่องมือ🔒15 นาที