Mengintegrasikan layanan Firebase menggunakan bantuan AI

Sederhanakan penyiapan Firebase untuk aplikasi web menggunakan alat pengembangan didukung AI seperti Antigravity, Claude Code, Codex, dan Cursor. Dengan menggunakan keahlian agen Firebase bersama Firebase CLI dan server Firebase MCP, Anda dapat mengubah agen coding AI menjadi pakar Firebase khusus yang dapat menulis kode, mengonfigurasi Firebase Security Rules, dan mengelola resource aktif.

Panduan ini membahas penggunaan agen coding AI untuk membantu menyiapkan Cloud Firestore, Firebase Authentication, dan Firebase Hosting untuk aplikasi web. Periksa kembali segera untuk mengetahui informasi tentang aplikasi iOS, Android, dan Flutter.

Mengapa menggunakan keahlian dan alat agen Firebase?

Agen coding AI sering kali kesulitan dengan konfigurasi project tertentu atau informasi yang sudah tidak berlaku. Toolkit ini menjembatani kesenjangan tersebut dengan menggabungkan petunjuk khusus (keahlian agen) dengan dua jenis alat eksekusi agen yang saling melengkapi (CLI dan server MCP):

• Keahlian agen Firebase: Memberikan keahlian domain dan alur kerja kepada agen coding. Sebagai lapisan petunjuk, keahlian memandu agen tentang praktik terbaik untuk menggunakan Firebase, termasuk menulis kode. Keahlian juga mengajari agen kapan dan cara menggunakan CLI Firebase dan server MCP Firebase.
• Alat eksekusi agen:
  • Firebase CLI (alat command line): Menyediakan alat untuk tugas siklus proses dan lingkungan project. Agen dapat menjalankan perintah CLI di lingkungan terminal untuk menyiapkan layanan di project Firebase, men-deploy situs lengkap atau resource backend, memulai emulator lokal, dan banyak lagi.
  • Server MCP Firebase (alat dan resource terprogram): Menyediakan alat untuk pemeriksaan real-time dan operasi data. Melalui panggilan alat terstruktur, agen dapat membuat kueri dan memperbarui dokumen Cloud Firestore secara terprogram, mengelola pengguna Firebase Authentication, memvalidasi Security Rules, menarik log atau dokumentasi langsung ke dalam konteks, dan banyak lagi.

Menggunakan keahlian agen Firebase bersama Firebase CLI dan server MCP Firebase akan memberi agen coding AI Anda kemampuan tambahan:

• Ambil tindakan: Lakukan lebih dari sekadar menulis kode. Agen Anda dapat menginisialisasi layanan, mengelola pengguna Firebase Authentication, men-deploy Firebase Security Rules baru, dan bekerja langsung dengan data Cloud Firestore Anda.
• Selalu dapatkan info terbaru: Gunakan perintah resmi yang mengetahui versi untuk memandu agen Anda menyelesaikan tugas penyiapan.
• Meningkatkan akurasi: Mengakses lingkungan dan skema project Anda untuk memberikan bantuan yang lebih relevan dan akurat.
• Mengurangi biaya token: Keahlian agen memuat dokumentasi mendetail hanya saat tugas tertentu memerlukannya, sehingga meminimalkan overhead sesi.

Layanan Firebase yang berlaku

Panduan ini berfokus terutama pada cara keahlian agen, Firebase CLI, dan server MCP Firebase bekerja sama untuk membantu Anda menyiapkan layanan dan fitur berikut dengan cepat:

• Cloud Firestore: Menyediakan database NoSQL.
• Firebase Authentication: Siapkan login pengguna yang aman.
• Firebase Security Rules: Buat dan sempurnakan Security Rules untuk aplikasi Anda.
• Firebase Hosting: Siapkan project Anda untuk deployment aplikasi web statis.

Untuk mengetahui daftar lengkap konfigurasi yang tersedia, jelajahi daftar lengkap keahlian agen Firebase.

Alur kerja umum

Langkah-langkah berikut menjelaskan alur kerja umum tentang cara menggunakan keahlian agen Firebase untuk menyiapkan dan menggunakan layanan Firebase di aplikasi web. Di balik layar, keahlian agen menggunakan Firebase CLI dan server Firebase MCP untuk menyelesaikan tugas ini.

Langkah 1: Instal keahlian agen Firebase

Dalam sebagian besar kasus, Anda dapat menginstal keahlian agen Firebase di editor pilihan Anda dengan satu perintah:

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

npx skills add firebase/agent-skills

Langkah 2: Hubungkan ke server Firebase MCP

Meskipun banyak keahlian agen Firebase menggunakan Firebase CLI untuk tugas, menghubungkan agen coding AI Anda ke server MCP Firebase juga direkomendasikan. Koneksi ini meningkatkan kemampuan agen Anda untuk berinteraksi dengan lingkungan Firebase, sehingga memberikan integrasi dan akses yang lebih mendalam.

Metode yang didukung AI

Pada umumnya, Anda dapat meminta agen coding AI untuk menyiapkan server Firebase MCP. Namun, jika mengalami kesulitan atau Anda tidak melihat server Firebase MCP tercantum, beralihlah ke Metode manual.

Metode manual

{
  "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"]
  }
}

Langkah 3: Lakukan inisialisasi layanan Firebase

Setelah menyiapkan keahlian agen dan alat, Anda kini dapat menggunakan bahasa alami untuk meminta agen coding AI menyiapkan Cloud Firestore, Firebase Authentication, dan Firebase Hosting.

1. Minta agen Anda untuk menyiapkan layanan. Misalnya, Anda dapat menggunakan perintah seperti berikut:

   • Siapkan Cloud Firestore sebagai database untuk aplikasi ini.
   • Buat halaman login menggunakan Authentication dan perbarui Security Rules untuk memastikan hanya pengguna yang diizinkan yang dapat membaca dan menulis data mereka sendiri.
   • Siapkan Firebase Hosting dan deploy aplikasi ke produksi.

2. Tinjau informasi dan ikuti langkah-langkah yang dipandu yang mungkin diberikan oleh agen Anda, seperti:

   1. Rencana: Agen Anda mengusulkan strategi berdasarkan codebase yang ada.
   2. Menghubungkan: Agen Anda menautkan kode lokal ke project Firebase yang ada atau membantu Anda membuat project Firebase baru.
   3. Menginisialisasi resource: Agen Anda menambahkan library dan konfigurasi Firebase yang diperlukan ke codebase Anda.
   4. Memperbarui file: Agen Anda membuat dan memperbarui file yang diperlukan, seperti firestore.rules (untuk menentukan siapa yang dapat membaca, menulis, atau membuat kueri data dalam database Anda) atau firebase.json (untuk memberi tahu Firebase CLI layanan mana yang akan di-deploy dan cara mengonfigurasinya).
   5. Mengeksekusi: Agen akan memandu Anda melalui langkah-langkah konfigurasi atau deployment tambahan.

Tips umum untuk memberikan perintah pada agen coding AI

Untuk mendapatkan hasil maksimal dari agen coding AI Anda, terutama saat bekerja dengan integrasi multifaset seperti Firebase, perlakukan interaksi sebagai kolaborasi, bukan perintah satu kali.

Berikan informasi yang spesifik dan konteks

Meskipun server MCP Firebase memberikan konteks yang signifikan tentang project Anda kepada agen, perintah bahasa alami yang jelas dan spesifik akan memberikan hasil terbaik. Hindari permintaan yang tidak jelas.

• Tidak jelas (Vague): "Perbaiki error database."
• Spesifik: "Saya mendapatkan error 'permission denied' saat mencoba menulis ke koleksi 'users' di Cloud Firestore. Tinjau firestore.rules saya dan sarankan perbaikan yang memungkinkan pengguna yang diautentikasi menulis ke dokumen mereka sendiri."

Lakukan iterasi dan penyempurnaan

Agen coding AI jarang menghasilkan kode yang sempurna pada percobaan pertama untuk tugas yang kompleks. Jika jawaban yang diberikan kurang tepat, lanjutkan percakapan:

• Berikan pesan error: Tempelkan error terminal atau log konsol kembali ke chat.
• Minta penyesuaian: "Kode tersebut menggunakan SDK v8 yang lebih lama. Tulis ulang menggunakan Firebase Modular SDK v9."
• Meminta penjelasan: "Jelaskan cara Firebase Security Rules tersebut melindungi data pengguna."

Verifikasi sebelum Anda mengeksekusi

Agen coding AI sangat canggih, tetapi dapat membuat kesalahan atau "berhalusinasi" (menciptakan fungsi atau layanan yang namanya salah).

• Tinjau kode: Selalu baca kode yang dihasilkan, terutama Firebase Security Rules dan file konfigurasi (seperti firebase.json), sebelum men-deploy ke produksi.
• Uji secara lokal: Jika memungkinkan, minta agen untuk membantu Anda menguji perubahan secara lokal sebelum menayangkannya.

Menggunakan koneksi MCP

Karena server MCP Firebase memberikan visibilitas langsung ke struktur project Anda, Anda dapat merujuk file tertentu untuk mendapatkan saran penerapan yang disesuaikan.

• Contoh: "Look at my src/web/index.html file and show me where to add the standard Firebase initialization script."

Langkah berikutnya

• Jelajahi daftar lengkap semua keahlian agen Firebase yang tersedia.
• Jelajahi daftar lengkap semua perintah, alat, dan resource yang tersedia yang disediakan oleh server Firebase MCP.
• Pelajari lebih lanjut alat yang disediakan oleh CLI Firebase.