คู่มือการใช้งาน VibeKit ฉบับย่อ

ยินดีต้อนรับเข้าสู่ คู่มือการใช้งาน VibeKit ฉบับย่อ หลังจากที่คุณได้สั่งซื้อ VibeKit แล้ว คุณจะได้รับอีเมล ที่มีคู่มือ และไฟล์ VibeKit starter เป็นไฟล์ .zip ที่เป็น Project สำเร็จรูปที่มีระบบพื้นฐานที่จำเป็นอยู่ครบถ้วน (Authentication, Access Control, Database, File Upload) สำหรับการทำ Web Application

รวม Playlist คู่มือการใช้งาน VibeKit ฉบับเต็ม

เกี่ยวกับการออกแบบ VibeKit

Tutorial สอนทำ Application

ระยะเวลาที่ต้องใช้ทั้งหมด 3 hours

  1. Setup: อัปโหลด VibeKit File ไว้บน GitHub ผ่าน GitHub Desktop

    การดาวน์โหลดไฟล์และเริ่มใช้งาน VibeKit ผ่าน GitHub

  2. Setup: การ Setup Codespaces เครื่องมือพัฒนาที่ใช้งานผ่าน Browser โดยไม่ต้องติดตั้งโปรแกรม

    เริ่มต้น การพัฒนา Application ผ่าน GitHub Codespaces โดยสามารถรันคำสั่ง Setup ที่จะให้กรอกข้อมูลเพื่อตั้งค่าระบบให้พร้อมใช้งาน
    – การดู Port และ URL ที่กำลังใช้งาน
    – การตั้งค่า Google OAuth สำหรับระบบ Authentication
    – การเปิด Database เพื่อดูข้อมูลในระบบ
    – การตั้งค่า Cloud Storage สำหรับอัปโหลดไฟล์ (ไม่จำเป็น)
    – ตั้งค่า NEXTAUTH_SECRET ด้วยตัวเอง เป็นรหัสจากการสุ่ม (HEX 32) (ไม่จำเป็น)

  3. PRD: การสร้าง Product Requirement Document (PRD)

    – สร้าง PRD สำหรับ Web Application
    – ตัวอย่าง Prompt อย่างง่าย

  4. Development: เริ่ม Vibe Coding บน GitHub Codespaces

    นำไฟล์ PRD (addons.md) ไปวางไว้บน Project แล้วเริ่ม Prompt สั่งงานทำตาม Milestone ตามลำดับ
    ดูตัวอย่างการทำผ่านการ Vibe Coding บน GitHub Codespaces

    หากเกิดปัญหา หรือต้องการแก้ไขอื่น ๆ
    – ให้ Restart app เมื่อมีปัญหาที่ Agent แก้แล้วแต่ยังไม่เห็นผล
    – เมื่อเกิดปัญหาไม่สามารถ Login ได้ Error 400: redirect_uri_mismatch
    – การทำ Versioning ด้วย GitHub และการตรวจสอบ Sourcecode

  5. Deployment: การ Deploy Project ขึ้น Production เพื่อนำไปใช้งานจริง

    – การ Deploy Project ขึ้น Production ผ่าน Railway
    – การสร้าง Dashboard ด้วย Lookerstudio

  6. Other: การจัดการ Database (ส่วนเสริม)

    สำหรับรูปแบบการใช้งานพิเศษที่ไม่สามารถ Vibe coding ได้ ขั้นตอนนี้จะช่วยให้คุณสามารถจัดการหรือเปลี่ยนแปลงโครงสร้าง Database ได้ด้วยตัวเอง
    – การออกแบบ Database (เวอร์ชั่นบทความ, เวอร์ชั่น VDO)
    – การสร้าง Schema ใหม่ — เพิ่มตารางใหม่ในฐานข้อมูล
    – การ Migrate Database — อัพเดทโครงสร้างฐานข้อมูลเมื่อมีการเปลี่ยนแปลง
    – การ Import ข้อมูลด้วย CSV — นำเข้าข้อมูลจากไฟล์ CSV
    – Supabase (PostgreSQL) — สร้างและตั้งค่าฐานข้อมูล Supabase สำหรับ Local development (ส่วนเสริม)

  7. Other: การใช้งานบน Platform อื่น ๆ

    – การใช้งานผ่าน Cursor IDE — สำหรับทำงานแบบ local บนเครื่องของคุณ (ส่วนเสริม)