Integra servicios de Firebase con asistencia de IA

Optimiza la configuración de Firebase para apps web con herramientas de desarrollo potenciadas por IA, como Antigravity, Claude Code, Codex y Cursor. Si usas las habilidades de agentes de Firebase junto con Firebase CLI y el servidor de MCP de Firebase, puedes transformar tu agente de codificación de IA en un experto especializado en Firebase que puede escribir código, configurar Firebase Security Rules y administrar recursos activos.

En esta guía, se explica cómo usar un agente de programación basado en IA para configurar Cloud Firestore, Authentication y Firebase Hosting para una app web. Vuelve a consultar esta guía pronto para obtener información sobre las apps para iOS, Android y Flutter.

¿Por qué usar las habilidades y herramientas de agentes de Firebase?

Los modelos de IA generales suelen tener dificultades con las configuraciones específicas de los proyectos o la información desactualizada. Este kit de herramientas cierra esa brecha:

• Habilidades de agentes de Firebase: Las habilidades proporcionan al agente de programación experiencia en el dominio. Proporcionan documentación actualizada y flujos de trabajo óptimos para que el agente conozca la forma correcta y recomendada por Firebase de estructurar tu arquitectura.
• Servidor de MCP de Firebase: El servidor de MCP le brinda contexto y acceso al agente de codificación. Establece un protocolo estándar para que el agente inspeccione de forma programática los recursos, los archivos locales y las configuraciones de tu proyecto activo.
• CLI de Firebase: La interfaz de línea de comandos le brinda al agente de codificación poder práctico. Es la herramienta de ejecución que usa el agente para realizar tareas pesadas, como inicializar bases de datos, administrar la configuración de autenticación de usuarios y, también, implementar código en tu nombre.

Usar las habilidades del agente de Firebase junto con la CLI de Firebase y el servidor de MCP de Firebase le brinda a tu agente de programación de IA capacidades adicionales:

• Toma medidas: Haz más que solo escribir código. Tu agente puede inicializar servicios, administrar usuarios de Authentication, implementar nuevos Firebase Security Rules y trabajar directamente con tus datos de Cloud Firestore.
• Mantente al día: Usa instrucciones oficiales y específicas de la versión para guiar a tu agente en las tareas de configuración.
• Mejorar la precisión: Accede al entorno y los esquemas de tu proyecto para brindar ayuda más pertinente y precisa.
• Reducción de los costos de los tokens: Las habilidades del agente cargan documentación detallada solo cuando una tarea específica lo requiere, lo que minimiza la sobrecarga de la sesión.

¿Con qué servicios de Firebase pueden ayudar las habilidades y herramientas del agente?

En esta guía, se explica principalmente cómo las habilidades del agente, la CLI de Firebase y el servidor de MCP de Firebase trabajan en conjunto para ayudarte a configurar rápidamente estos servicios y funciones:

• Cloud Firestore: Aprovisiona una base de datos NoSQL.
• Authentication: Configura el acceso seguro del usuario.
• Firebase Security Rules: Genera y define mejor la Security Rules de tu app.
• Firebase Hosting: Configura tu proyecto para la implementación de la app web estática.

Para obtener una lista completa de lo que está disponible, consulta la lista completa de habilidades de agentes de Firebase.

Flujo de trabajo general

En los siguientes pasos, se describe un flujo de trabajo generalizado para usar las habilidades de agentes de Firebase para configurar y usar los servicios de Firebase en una app web. En segundo plano, las habilidades de agentes usan la CLI de Firebase y el servidor de MCP de Firebase para completar estas tareas.

Paso 1: Instala habilidades de agentes de Firebase

En la mayoría de los casos, puedes instalar las habilidades de agentes de Firebase en tu editor preferido con una sola instrucción:

npx skills add firebase/agent-skills --agent=antigravity

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

npx skills add firebase/agent-skills --agent=codex

npx skills add firebase/agent-skills --agent=cursor

npx skills add firebase/agent-skills

Paso 2: Conéctate al servidor de MCP de Firebase

Si bien muchas habilidades de agentes de Firebase usan la CLI de Firebase para las tareas, se recomienda conectar tu agente de codificación de IA al servidor de MCP de Firebase. Esta conexión mejora la capacidad del agente para interactuar con tu entorno de Firebase, lo que proporciona una integración y un acceso más profundos.

Método asistido por IA

En la mayoría de los casos, puedes pedirle a tu agente de programación con IA que configure el servidor de MCP de Firebase. Sin embargo, si tienes problemas o no ves el servidor de MCP de Firebase en la lista, cambia al método manual.

Método 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
    }
  }
}

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

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

Paso 3: Inicializa los servicios de Firebase

Con las habilidades y herramientas del agente configuradas, ahora puedes usar lenguaje natural para que tu agente de programación con IA configure Cloud Firestore, Authentication y Firebase Hosting.

1. Solicita a tu agente que configure un servicio. Por ejemplo, puedes usar instrucciones como las siguientes:

   • Configura Cloud Firestore como la base de datos de esta app.
   • Crea una página de acceso con Authentication y actualiza Security Rules para garantizar que solo los usuarios autorizados puedan leer y escribir sus propios datos.
   • Configura Firebase Hosting y, luego, implementa la app en producción.

2. Revisa la información y sigue los pasos guiados que te proporcione el agente, como los siguientes:

   1. Planes: Tu agente propone una estrategia basada en tu base de código existente.
   2. Conecta: Tu agente vincula tu código local a un proyecto de Firebase existente o te ayuda a crear uno nuevo.
   3. Inicializa recursos: Tu agente agrega las bibliotecas y la configuración de Firebase requeridas a tu base de código.
   4. Actualiza archivos: Tu agente crea y actualiza los archivos necesarios, como firestore.rules (para definir quién puede leer, escribir o consultar datos en tu base de datos) o firebase.json (para informar a la CLI de Firebase qué servicios implementar y cómo configurarlos).
   5. Ejecuta: Tu agente te guía a través de pasos adicionales de configuración o implementación.

Sugerencias generales para dar instrucciones a un agente de programación de IA

Para aprovechar al máximo tu agente de programación con IA, especialmente cuando trabajas con integraciones multifacéticas como Firebase, considera la interacción como una colaboración en lugar de un comando único.

Escribir instrucciones específicas y proporcionar contexto

Si bien el servidor de MCP de Firebase proporciona al agente un contexto significativo sobre tu proyecto, las instrucciones claras y específicas en lenguaje natural producen los mejores resultados. Evita las solicitudes vagas.

• Vago: "Corrige el error de la base de datos".
• Específico: "Recibo un error de "permiso denegado" cuando intento escribir en la colección "usuarios" en Cloud Firestore. Revisa mi firestore.rules y sugiere una corrección que permita a los usuarios autenticados escribir en su propio documento".

Itera y define mejor

Los agentes de programación de IA rara vez generan código perfecto en el primer intento para tareas complejas. Si una respuesta no es del todo correcta, continúa la conversación:

• Proporciona mensajes de error: Pega los errores de la terminal o los registros de la consola en el chat.
• Solicita ajustes: "Ese código usa el SDK de la versión 8 anterior. Reescríbelo con el SDK modular v9 de Firebase".
• Solicita explicaciones: "Explica cómo esos Firebase Security Rules protegen los datos del usuario".

Verifica antes de ejecutar

Los agentes de codificación de IA son potentes, pero pueden cometer errores o "alucinar" (inventar funciones o servicios con nombres incorrectos).

• Revisa el código: Siempre lee el código generado, en especial los archivos de configuración y Firebase Security Rules (como firebase.json), antes de realizar la implementación en producción.
• Prueba de forma local: Siempre que sea posible, pídele al agente que te ayude a probar los cambios de forma local antes de publicarlos.

Usa la conexión de MCP

Dado que el servidor de MCP de Firebase le brinda a tu agente visibilidad directa de la estructura de tu proyecto, puedes hacer referencia a archivos específicos para obtener asesoramiento personalizado sobre la implementación.

• Ejemplo: "Mira mi archivo src/web/index.html y muéstrame dónde agregar la secuencia de comandos de inicialización estándar de Firebase".

Próximos pasos

• Consulta una lista completa de todas las habilidades disponibles de los agentes de Firebase.
• Consulta una lista completa de todos los mensajes, las herramientas y los recursos disponibles que proporciona el servidor de MCP de Firebase.
• Obtén más información sobre las herramientas que proporciona la CLI de Firebase.