EP.1 สอนใช้ Antigravity IDE เบื้องต้น: Rules, Workflow และให้ AI สร้าง Next.js App จนจบ

คลิปนี้พาเริ่มต้นใช้งาน Antigravity IDE สำหรับคนที่ต้องการใช้ AI Agent ช่วยพัฒนาโปรเจกต์จริงแบบเป็นระบบ เราจะเริ่มตั้งแต่การดู Models ที่ใช้งานได้, การตรวจสอบ Limit Remaining, การดูและจัดการ MCP Servers รวมถึงการกำหนด rules.md เพื่อบอกมาตรฐานของโปรเจกต์ให้ AI Agent เข้าใจ จากนั้นจะสร้าง Workflow requirement-to-implementation.md เพื่อให้ Agent ทำงานตามลำดับ: Requirement → Analysis → Plan → Implement → Validate → Browser Test Demo App ในคลิปคือ FlowDesk ระบบจัดการคำขอและงานในทีม ที่พัฒนาด้วย Next.js, TypeScript, Prisma และฐานข้อมูล 00:00 แนะนำ Antigravity IDE ของ Google คืออะไร 01:21 แนะนำหน้าเว็บและเครื่องมือในระบบ (CLI, Server Management) 03:00 การดาวน์โหลด ติดตั้ง และเข้าสู่ระบบ 03:42 แนะนำ Settings โควตาแพ็กเกจ และการเลือก AI Models 06:55 แนะนำการเชื่อมต่อ MCP Server (Chrome DevTools, Postman) 07:44 สำคัญมาก: Customization และการกำหนด Rules (scope ให้ AI) 09:12 ให้ AI เจนไฟล์ Rules.md ตาม Tech Stack (Next.js, Prisma, MySQL) 13:30 นำ Rules.md เข้าไปตั้งค่าใน Workspace 14:45 การสร้าง Workflows เพื่อควบคุมขั้นตอนการทำงานของ Agent 16:45 บันทึกและตั้งค่า Workflow (Requirement to Implementation) 18:42 ลงมือสร้างแอปจริง (Flowdesk) ด้วยคำสั่ง Workflow 20:09 AI วิเคราะห์และวาง Implementation Plan ให้ผู้ใช้ยืนยัน 21:32 AI เริ่มเขียนโค้ดและเปิดเบราว์เซอร์ทดสอบอัตโนมัติ 25:31 สรุปผลงานและพาดูโครงสร้างโค้ด/โฟลเดอร์ที่ AI เจนให้ 28:45 ทดสอบรันและเล่นระบบบน Localhost (User, Manager, Admin) 30:52 เช็กการใช้งาน Token / โควตาหลังเจนโปรเจกต์ 31:30 สรุปเทคนิคการใช้ Rules และ Workflows ให้คุ้มค่า resource : https://github.com/notcis/FlowDesk สิ่งที่ได้ดูในคลิป: แนะนำหน้าจอและการใช้งาน Antigravity IDE เบื้องต้น เลือก Model และตรวจสอบ Limit Remaining ดู MCP Servers และบทบาทของ MCP ในการเชื่อม AI กับเครื่องมือ สร้าง rules.md เพื่อควบคุมมาตรฐานการทำงานของ Agent สร้าง Workflow requirement-to-implementation.md ใช้ AI Agent วิเคราะห์ requirement และวางแผนก่อนเขียนโค้ด ให้ Agent เขียนโค้ด Next.js สำหรับ FlowDesk ให้ Agent เปิด Browser และทดสอบการทำงานจริง สรุปแนวทางใช้ AI Coding กับโปรเจกต์จริงอย่างปลอดภัยและตรวจสอบได้ FlowDesk เป็นระบบรับคำขอและจัดการงานในทีม โดยมีตัวอย่างฟีเจอร์ เช่น สร้างคำขอ, กำหนดความสำคัญ, เปลี่ยนสถานะ, อนุมัติคำขอ และติดตามงาน หมายเหตุ: ควรตรวจสอบโค้ด, สิทธิ์การเข้าถึง, environment variables, database migration และผลการทดสอบทุกครั้งก่อนนำขึ้น production #AntigravityIDE #AICoding #AIAgent #Nextjs #NextJSThailand #Gemini #MCP #ModelContextProtocol #TypeScript #Prisma #WebDevelopment #CodingWorkflow #SoftwareDevelopment #สอนเขียนโปรแกรม #AIเขียนโค้ด #โปรแกรมเมอร์