ผสานรวมบริการ Firebase โดยใช้ความช่วยเหลือจาก AI

ปรับปรุงการตั้งค่า Firebase สำหรับเว็บแอปให้มีประสิทธิภาพยิ่งขึ้นโดยใช้เครื่องมือพัฒนาที่ทำงานด้วยระบบ AI เช่น Antigravity, Claude Code, Codex และ Cursor การใช้ทักษะเอเจนต์ Firebase ร่วมกับ Firebase CLI และเซิร์ฟเวอร์ Firebase MCP จะช่วยให้คุณเปลี่ยนเอเจนต์การเขียนโค้ด AI ให้เป็นผู้เชี่ยวชาญ Firebase โดยเฉพาะที่สามารถเขียนโค้ด กำหนดค่า Firebase Security Rules และจัดการทรัพยากรที่ใช้งานอยู่ได้

คู่มือนี้ครอบคลุมการใช้เอเจนต์การเขียนโค้ด AI เพื่อช่วยตั้งค่า Cloud Firestore, Firebase Authentication และ Firebase Hosting สำหรับเว็บแอป โปรดกลับมาตรวจสอบข้อมูลเกี่ยวกับแอป iOS, Android และ Flutter ในเร็วๆ นี้

เหตุใดจึงควรใช้ทักษะและเครื่องมือของเอเจนต์ Firebase

เอเจนต์การเขียนโค้ด AI มักประสบปัญหาเกี่ยวกับการกำหนดค่าโปรเจ็กต์ที่เฉพาะเจาะจงหรือข้อมูลที่ล้าสมัย ชุดเครื่องมือนี้จะช่วยแก้ปัญหานี้โดยการรวมคำสั่งเฉพาะ (ทักษะของ Agent) เข้ากับเครื่องมือการดำเนินการของ Agent 2 ประเภทที่เสริมกัน (CLI และเซิร์ฟเวอร์ MCP) ดังนี้

• ทักษะเอเจนต์ Firebase: ช่วยให้เอเจนต์การเขียนโค้ดมีความเชี่ยวชาญเฉพาะด้านและเวิร์กโฟลว์ ในฐานะเลเยอร์คำสั่ง ทักษะจะแนะนำเอเจนต์เกี่ยวกับแนวทางปฏิบัติแนะนำสำหรับการทำงานกับ Firebase รวมถึงการเขียนโค้ด นอกจากนี้ ทักษะยังสอน Agent ว่าควรใช้ Firebase CLI และเซิร์ฟเวอร์ Firebase MCP เมื่อใดและอย่างไร
• เครื่องมือการดำเนินการของ Agent
  • Firebase CLI (เครื่องมือบรรทัดคำสั่ง): มีเครื่องมือสำหรับวงจรของโปรเจ็กต์และงานด้านสภาพแวดล้อม โดย Agent สามารถเรียกใช้คำสั่ง CLI ในสภาพแวดล้อมเทอร์มินัลเพื่อตั้งค่าบริการในโปรเจ็กต์ Firebase, ติดตั้งใช้งานทั้งเว็บไซต์หรือทรัพยากรแบ็กเอนด์, เริ่มโปรแกรมจำลองในเครื่อง และอื่นๆ
  • เซิร์ฟเวอร์ Firebase MCP (เครื่องมือและแหล่งข้อมูลแบบเป็นโปรแกรม): มีเครื่องมือสำหรับการตรวจสอบและการดำเนินการกับข้อมูลแบบเรียลไทม์ การเรียกใช้เครื่องมือที่มีโครงสร้างช่วยให้ Agent สามารถค้นหาและอัปเดตเอกสาร Cloud Firestore, จัดการผู้ใช้ Firebase Authentication, ตรวจสอบ Security Rules, ดึงบันทึกหรือเอกสารแบบเรียลไทม์ลงในบริบทโดยตรง และอื่นๆ อีกมากมายผ่านการเขียนโปรแกรม

การใช้ทักษะเอเจนต์ Firebase ร่วมกับ Firebase CLI และเซิร์ฟเวอร์ MCP ของ Firebase จะช่วยให้เอเจนต์การเขียนโค้ด AI มีความสามารถเพิ่มเติมดังนี้

• ดำเนินการ: ทำได้มากกว่าแค่เขียนโค้ด ตัวแทนของคุณสามารถเริ่มต้นบริการ จัดการผู้ใช้ Firebase Authentication ติดตั้งใช้งาน Firebase Security Rules ใหม่ และทำงานกับข้อมูล Cloud Firestore ของคุณโดยตรง
• ติดตามข้อมูลล่าสุด: ใช้พรอมต์อย่างเป็นทางการที่คำนึงถึงเวอร์ชันเพื่อแนะนำ Agent ในการตั้งค่าต่างๆ
• ปรับปรุงความแม่นยำ: เข้าถึงสภาพแวดล้อมและสคีมาของโปรเจ็กต์เพื่อให้ความช่วยเหลือที่เกี่ยวข้องและแม่นยำยิ่งขึ้น
• ลดค่าใช้จ่ายโทเค็น: ทักษะของ Agent จะโหลดเอกสารประกอบโดยละเอียดเมื่อมีงานที่เฉพาะเจาะจงเท่านั้น ซึ่งจะช่วยลดค่าใช้จ่ายในการดำเนินการของเซสชัน

บริการ Firebase ที่เกี่ยวข้อง

คู่มือนี้จะเน้นไปที่วิธีการทำงานร่วมกันของทักษะ Agent, Firebase CLI และเซิร์ฟเวอร์ Firebase MCP เพื่อช่วยให้คุณตั้งค่าบริการและฟีเจอร์ต่อไปนี้ได้อย่างรวดเร็ว

• Cloud Firestore: จัดสรรฐานข้อมูล NoSQL
• Firebase Authentication: ตั้งค่าการลงชื่อเข้าใช้ของผู้ใช้ที่ปลอดภัย
• Firebase Security Rules: สร้างและปรับแต่งSecurity Rulesสำหรับแอปของคุณ
• Firebase Hosting: ตั้งค่าโปรเจ็กต์สำหรับการติดตั้งใช้งานเว็บแอปแบบคงที่

ดูรายการทั้งหมดที่มีได้ที่รายการทักษะเอเจนต์ Firebase ทั้งหมด

เวิร์กโฟลว์ทั่วไป

ขั้นตอนต่อไปนี้อธิบายเวิร์กโฟลว์ทั่วไปเกี่ยวกับวิธีใช้ทักษะเอเจนต์ Firebase เพื่อตั้งค่าและใช้บริการ Firebase ในเว็บแอป เบื้องหลังคือทักษะเอเจนต์จะใช้ CLI ของ Firebase และเซิร์ฟเวอร์ MCP ของ Firebase เพื่อทำงานเหล่านี้ให้เสร็จสมบูรณ์

ขั้นตอนที่ 1: ติดตั้งทักษะเอเจนต์ Firebase

ในกรณีส่วนใหญ่ คุณสามารถติดตั้งทักษะเอเจนต์ Firebase ในเครื่องมือแก้ไขที่ต้องการได้ด้วยพรอมต์เดียว ดังนี้

claude plugin marketplace add firebase/agent-skills
claude plugin install firebase@firebase

npx skills add firebase/agent-skills

ขั้นตอนที่ 2: เชื่อมต่อกับเซิร์ฟเวอร์ MCP ของ Firebase

แม้ว่าทักษะเอเจนต์ Firebase จำนวนมากจะใช้ Firebase CLI สำหรับงานต่างๆ แต่เราขอแนะนำให้เชื่อมต่อเอเจนต์การเขียนโค้ด AI กับเซิร์ฟเวอร์ Firebase MCP ด้วย การเชื่อมต่อนี้จะช่วยเพิ่มความสามารถของ Agent ในการโต้ตอบกับสภาพแวดล้อม Firebase ของคุณ ซึ่งจะช่วยให้ผสานรวมและเข้าถึงได้ลึกซึ้งยิ่งขึ้น

วิธีการที่มีการใช้งาน AI

ในกรณีส่วนใหญ่ คุณสามารถขอให้ตัวแทนการเขียนโค้ด AI ตั้งค่าเซิร์ฟเวอร์ Firebase MCP ได้ อย่างไรก็ตาม หากพบปัญหาหรือคุณไม่เห็นเซิร์ฟเวอร์ MCP ของ Firebase ในรายการ ให้เปลี่ยนไปใช้วิธีการด้วยตนเอง

วิธีการแบบแมนนวล

{
  "mcpServers": {
    "firebase-mcp-server": {
      "command": "npx",
      "args": ["-y", "firebase-tools@latest", "mcp"]
    }
  }
}

{
  "mcpServers": {
    "firebase": {
      "command": "npx",
      "args": ["-y", "firebase-tools@latest", "mcp"]
    }
  }
}

"mcpServers": {
  "firebase": {
    "command": "npx",
    "args": ["-y", "firebase-tools@latest", "mcp"]
  }
}

{
  "mcpServers": {
    "firebase": {
      "command": "npx",
      "args": ["-y", "firebase-tools@latest", "mcp"],
      "disabled": false
    }
  }
}

"servers": {
  "firebase": {
    "type": "stdio",
    "command": "npx",
    "args": ["-y", "firebase-tools@latest", "mcp"]
  }
}

"mcp": {
  "servers": {
    "firebase": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "firebase-tools@latest", "mcp"]
    }
  }
}

"mcpServers": {
  "firebase": {
    "command": "npx",
    "args": ["-y", "firebase-tools@latest", "mcp"]
  }
}

ขั้นตอนที่ 3: เริ่มต้นบริการ Firebase

เมื่อตั้งค่าทักษะและเครื่องมือของ Agent แล้ว ตอนนี้คุณสามารถใช้ภาษาธรรมชาติเพื่อให้ Agent การเขียนโค้ดด้วย AI ตั้งค่า Cloud Firestore, Firebase Authentication และ Firebase Hosting ได้

1. ขอให้ตัวแทนตั้งค่าบริการ ตัวอย่างเช่น คุณสามารถใช้พรอมต์ต่อไปนี้ได้

   • ตั้งค่า Cloud Firestore เป็นฐานข้อมูลสำหรับแอปนี้
   • สร้างหน้าเข้าสู่ระบบโดยใช้ Authentication และอัปเดต Security Rules เพื่อให้มั่นใจว่ามีเพียงผู้ใช้ที่ได้รับอนุญาตเท่านั้นที่สามารถอ่านและเขียนข้อมูลของตนเองได้
   • ตั้งค่า Firebase Hosting และทำให้แอปใช้งานได้จริง

2. ตรวจสอบข้อมูลและทำตามขั้นตอนที่แนะนำซึ่งตัวแทนอาจให้ไว้ เช่น

   1. แผน: Agent จะเสนอกลยุทธ์ตามฐานของโค้ดที่มีอยู่
   2. เชื่อมต่อ: Agent จะลิงก์โค้ดในเครื่องกับโปรเจ็กต์ Firebase ที่มีอยู่หรือช่วยคุณสร้างโปรเจ็กต์ Firebase ใหม่
   3. เริ่มต้นทรัพยากร: Agent จะเพิ่มไลบรารีและการกำหนดค่า Firebase ที่จำเป็นลงในฐานของโค้ด
   4. อัปเดตไฟล์: Agent จะสร้างและอัปเดตไฟล์ที่จำเป็น เช่น firestore.rules (เพื่อกำหนดว่าใครสามารถอ่าน เขียน หรือค้นหาข้อมูลภายในฐานข้อมูลได้) หรือ firebase.json (เพื่อแจ้ง Firebase CLI ว่าจะติดตั้งใช้งานบริการใดและกำหนดค่าอย่างไร)
   5. ดำเนินการ: Agent จะแนะนำขั้นตอนการกำหนดค่าหรือการติดตั้งใช้งานเพิ่มเติม

เคล็ดลับทั่วไปสำหรับการเขียนพรอมต์ให้ Agent การเขียนโค้ด AI

เพื่อให้ได้รับประโยชน์สูงสุดจาก Agent การเขียนโค้ด AI โดยเฉพาะเมื่อทำงานกับการผสานรวมหลายแง่มุม เช่น Firebase ให้มองว่าการโต้ตอบเป็นการทำงานร่วมกัน ไม่ใช่คำสั่งแบบครั้งเดียว

ระบุให้ชัดเจนและให้บริบท

แม้ว่าเซิร์ฟเวอร์ Firebase MCP จะให้บริบทที่สำคัญเกี่ยวกับโปรเจ็กต์แก่ Agent แต่พรอมต์ภาษาธรรมชาติที่ชัดเจนและเฉพาะเจาะจงจะให้ผลลัพธ์ที่ดีที่สุด หลีกเลี่ยงคำขอที่คลุมเครือ

• คลุมเครือ: "แก้ไขข้อผิดพลาดของฐานข้อมูล"
• เฉพาะเจาะจง: "ฉันได้รับข้อผิดพลาด 'สิทธิ์ถูกปฏิเสธ' เมื่อพยายามเขียนไปยังคอลเล็กชัน 'ผู้ใช้' ใน Cloud Firestore ตรวจสอบ firestore.rules ของฉันและแนะนำการแก้ไขที่อนุญาตให้ผู้ใช้ที่ตรวจสอบสิทธิ์แล้วเขียนลงในเอกสารของตนเองได้"

ทำซ้ำและปรับแต่ง

AI Coding Agent ไม่ค่อยสร้างโค้ดที่สมบูรณ์แบบได้ตั้งแต่ครั้งแรกสำหรับงานที่ซับซ้อน หากคำตอบยังไม่ถูกต้องนัก ให้สนทนาต่อโดยทำดังนี้

• ระบุข้อความแสดงข้อผิดพลาด: วางข้อผิดพลาดของเทอร์มินัลหรือบันทึกคอนโซลกลับลงในแชท
• ขอให้ปรับเปลี่ยน: "โค้ดนั้นใช้ SDK เวอร์ชัน 8 ที่เก่ากว่า เขียนใหม่โดยใช้ Firebase v9 modular SDK"
• ขอคำอธิบาย: "อธิบายวิธีที่ Firebase Security Rules เหล่านั้นปกป้องข้อมูลผู้ใช้"

ตรวจสอบก่อนดำเนินการ

เอเจนต์การเขียนโค้ด AI มีประสิทธิภาพมาก แต่ก็อาจทำผิดพลาดหรือ "หลอน" ได้ (สร้างฟังก์ชันที่มีชื่อไม่ถูกต้อง)

• ตรวจสอบโค้ด: อ่านโค้ดที่สร้างขึ้นเสมอ โดยเฉพาะ Firebase Security Rules และไฟล์การกำหนดค่า (เช่น firebase.json) ก่อนนำไปใช้งานจริง
• ทดสอบในเครื่อง: หากเป็นไปได้ ให้ขอให้ Agent ช่วยทดสอบการเปลี่ยนแปลงในเครื่องก่อนที่จะเผยแพร่

ใช้การเชื่อมต่อ MCP

เนื่องจากเซิร์ฟเวอร์ Firebase MCP ช่วยให้ Agent มองเห็นโครงสร้างโปรเจ็กต์ของคุณโดยตรง คุณจึงสามารถอ้างอิงไฟล์ที่เฉพาะเจาะจงเพื่อรับคำแนะนำในการติดตั้งใช้งานที่ปรับให้เหมาะกับคุณได้

• ตัวอย่าง: "ดูไฟล์ src/web/index.html ของฉันและแสดงให้ฉันเห็นว่าควรเพิ่มสคริปต์การเริ่มต้น Firebase มาตรฐานตรงไหน"

ขั้นตอนถัดไป

• เรียกดูรายการทักษะเอเจนต์ Firebase ทั้งหมดที่มี
• เรียกดูรายการพรอมต์ เครื่องมือ และแหล่งข้อมูลทั้งหมดที่เซิร์ฟเวอร์ Firebase MCP มีให้
• ดูข้อมูลเพิ่มเติมเกี่ยวกับเครื่องมือที่ Firebase CLI มีให้