Comienza a usar Firebase SQL Connect con agentes de IA

En esta guía de inicio rápido, se muestra cómo usar Firebase SQL Connect con tu herramienta de programación con IA para compilar rápidamente aplicaciones relacionales de pila completa. Si equipas tu agente con las habilidades de Firebase Agent Skills, no necesitarás escribir código estándar de la base de datos ni configurar extremos de forma manual. Aprenderás a configurar tu proyecto local, configurar tu asistente de IA y usar una sola instrucción para generar un esquema de PostgreSQL seguro, operaciones de GraphQL y un frontend completo de React. Puedes usar lo que aprendas aquí para compilar frontends para cualquiera de las plataformas que admite Firebase SQL Connect.

Antes de comenzar

Para completar esta guía de inicio rápido, asegúrate de que tu entorno esté configurado con lo siguiente. Si necesitas ayuda paso a paso para tu sistema operativo específico, consulta la guía de configuración estándar:

  • Node.js: Instala Node.js para ejecutar Firebase CLI y potenciar tu frontend de React generado.

  • Firebase CLI: Instala Firebase CLI de forma global:

    npm install -g firebase-tools

  • Herramienta de programación con IA: Instala un editor moderno potenciado por IA (como Antigravity, Android Studio, Cursor o Windsurf).

Configura tu espacio de trabajo

Primero, abre tu herramienta de programación con IA preferida y crea un nuevo directorio de proyecto. Abre la terminal integrada de tu herramienta y ejecuta el comando de inicialización:

firebase init dataconnect

Este comando te guía para inicializar tu proyecto. Cuando se te solicite, elige las opciones para hacer lo siguiente:

  • Crear un proyecto de Firebase nuevo
  • Cómo omitir la generación de esquemas de Gemini
  • Crea una nueva instancia de Cloud SQL
  • Crea una plantilla de React
  • Selecciona Sí para instalar Agent Skills for Firebase

Genera tu app con IA

Con las habilidades de agente de Firebase instaladas, tu asistente de IA puede generar tu esquema, tus operaciones y tu código de frontend de SQL Connect directamente a partir de una instrucción de alto nivel.

Copia y pega una de las siguientes instrucciones en tu asistente de IA para generar tu backend, las relaciones de la base de datos y el frontend de React:

Ejemplo 1: App de opiniones de películas

Instrucción:

Build a movie review website using Firebase SQL Connect. Customers can browse
a catalog of movies presented in a modern card layout displaying average
ratings and review counts, and leave a review from 1 to 5 stars. A user must
only be allowed to leave a single review per movie. Build a styled React
(Vite) frontend that displays the catalog and dynamically renders a live feed
of new reviews. Compile the database backend and React frontend, seed the
database with sample data, and verify that the application builds cleanly and
all core user flows run successfully.

Ejemplo 2: Tienda de comercio electrónico

Instrucción:

Build an online storefront using Firebase SQL Connect. Customers can browse
product cards showing prices and stock levels, manage a shopping cart, and
check out securely. The checkout transaction must atomically verify that
their cart is not empty, check that products are in stock, create the order,
and decrease the product stock, safely rolling back if any step fails.
Build a highly responsive React (Vite) storefront with a polished checkout
process. Compile the database backend and React frontend, seed the database
with sample data, and verify that the application builds cleanly and all
core user flows run successfully.

Ejemplo 3: Blog de varios autores

Instrucción:

Create a multi-author blog platform using Firebase SQL Connect. The homepage
should display published articles formatted in an elegant typographic layout
with comfortable reading line lengths and serif headings. Users should have
access to a secure split-pane writing dashboard built using React (Vite) to
compose posts with a live preview. Compile the database backend and React
frontend, seed the database with sample data, and verify that the
application builds cleanly and all core user flows run successfully.

Qué crea tu Asistente de IA

Cuando ejecutas estas instrucciones, tu asistente de IA se encarga automáticamente del trabajo técnico pesado:

  • Esquema de la base de datos (dataconnect/schema/schema.gql): Traduce tus requisitos en tablas relacionales con la directiva @table y administra automáticamente las claves externas y las claves principales.
  • Operaciones de GraphQL (dataconnect/[connector_name]/*.gql): Genera las consultas y mutaciones exactas que requiere tu app, protegidas por la directiva @auth.
  • SDK generado (src/dataconnect/): Usa Firebase CLI para generar al instante un SDK de cliente con escritura estricta basado en tu esquema y tus operaciones.
  • Frontend de React (src/): Conecta una aplicación de React completa y con un diseño atractivo que usa el SDK generado para comunicarse con tu nuevo backend.

Implementar en producción

Para implementar tu esquema, tus consultas y tus mutaciones en producción, ejecuta el siguiente comando en tu terminal:

firebase deploy --only dataconnect

Después de la implementación, visita Firebase console para ver tu esquema activo y ejecutar operaciones directamente en tu instancia de Cloud SQL.

Próximos pasos

Ahora que completaste la guía de inicio rápido, estos son algunos pasos que puedes seguir:

  • Explora un repositorio de apps de inicio rápido y compila una app de SQL Connect siguiendo nuestros codelabs.
  • Agrega datos a tu base de datos y supervisa tu servicio de SQL Connect en Firebase console.
  • Obtén más información sobre el desarrollo de esquemas, consultas y mutaciones.
  • Obtén más información sobre los SDKs de cliente y los SDKs de Admin.