Desarrolla apps de full stack en Google AI Studio

Google AI Studio ahora admite el desarrollo de pila completa, lo que te permite compilar aplicaciones que van más allá de los prototipos del cliente. Con un entorno de ejecución del servidor, puedes administrar secretos, conectarte a APIs externas y crear experiencias multijugador en tiempo real.

Entorno de ejecución del servidor

Las aplicaciones de Google AI Studio ahora pueden incluir un componente del servidor (Node.js). Esto te permite hacer lo siguiente:

  • Ejecutar lógica del servidor: Ejecuta código que no debe exponerse al cliente.
  • Acceder a paquetes npm: El agente Antigravity puede instalar y usar paquetes del vasto ecosistema de npm.
  • Administrar secretos: Usa de forma segura las claves de API y las credenciales.

Usa paquetes npm

No es necesario que ejecutes npm install de forma manual. Solo pídele al agente que agregue la funcionalidad que requiere un paquete, y se encargará de la instalación y la importación.

Ejemplo: > "Usa axios para recuperar datos de la API externa".

Administra secretos de forma segura

Con el código del servidor y la administración de secretos, ahora puedes compilar apps que interactúen con el mundo.

Clave de API de Gemini

Cuando creas una app nueva que usa la API de Gemini, AI Studio configura automáticamente tu GEMINI_API_KEY como un secreto del servidor, sin necesidad de configuración manual. Puedes ver esta clave en el panel Secretos de Configuración. Las llamadas a la API de Gemini de tu app se realizan desde el código del servidor con esta clave, por lo que nunca se expone en el navegador.

Claves de API de terceros

Para otros servicios, puedes agregar claves de API de forma manual:

  • APIs de terceros: Conéctate a servicios como Stripe, SendGrid o APIs de REST personalizadas.
  • Bases de datos: Conéctate a bases de datos externas (p.ej., a través de Supabase, Firebase, o MongoDB Atlas) para conservar los datos más allá de la sesión.

Cuando compilas apps del mundo real, a menudo necesitas conectarte a servicios de terceros (como Twilio, Slack o bases de datos) que requieren claves de API. Puedes agregar claves de forma manual con los siguientes pasos:

  1. Agrega un secreto: Ve al menú Configuración en Google AI Studio y busca la sección Secretos.
  2. Almacena tu clave: Agrega aquí tus claves de API o tokens secretos.
  3. Accede al código: El agente puede escribir código del servidor que acceda a estos secretos de forma segura (por lo general, a través de variables de entorno), lo que garantiza que nunca se expongan al navegador del cliente.

Cuando sea necesario, el agente también mostrará una tarjeta en el chat que te solicitará que agregues claves cuando se necesite un secreto nuevo o cuando se detecte una clave nueva en las variables de entorno del proyecto.

Integración de Firebase para la base de datos y la autenticación

Google AI Studio ahora facilita la adición de una base de datos o la autenticación a tu app a través de una integración de Firebase. El agente Antigravity puede aprovisionar y configurar automáticamente los siguientes servicios:

  • Base de datos de Firestore: Una base de datos NoSQL flexible, escalable y en la nube para almacenar y sincronizar datos para el desarrollo en el cliente y el servidor.
  • Firebase Authentication: Permite que los usuarios accedan de forma segura a tu aplicación con los flujos de "Acceder con Google".

Solo pídele al agente que "agregue una base de datos a mi app" o que "configure el acceso con Google", y se encargará de la configuración y la generación de código necesarias.

Firebase te permite comenzar de forma gratuita y, de manera opcional, escalar con una cuenta pagada cuando estés listo para obtener más cuota o usar funciones pagadas.

Configura OAuth

Un caso de uso clave para la administración de secretos es configurar OAuth para conectarse a otros sitios web o apps. Cuando tu instrucción incluye instrucciones para conectarse a una app de terceros que requiere autenticación de OAuth, el agente proporcionará instrucciones para configurar OAuth para esa aplicación. Estas instrucciones incluirán las URLs de devolución de llamada necesarias para configurar tu aplicación de OAuth. También puedes encontrar las URLs de devolución de llamada en Integraciones en el panel Configuración.

Crea experiencias multijugador

El entorno de ejecución de pila completa habilita las funciones de colaboración en tiempo real.

  • Estado en tiempo real: Puedes pedirle al agente que cree funciones como "un chat en vivo", "una pizarra colaborativa" o "un juego multijugador".
  • Sesiones sincronizadas: El servidor administra el estado, lo que permite que varios usuarios interactúen con la misma instancia de la aplicación en tiempo real.

Ejemplo de instrucción: > "Haz que este sea un juego multijugador en el que los jugadores puedan ver los cursores de los demás."

Sugerencias para probar apps multijugador

Puedes probar el modo multijugador de dos maneras antes de implementar tu app.

  1. Abre tu app en el modo de compilación de Google AI Studio en varias pestañas. Cuando desarrollas en el modo de compilación, tu app está en un contenedor de desarrollo. Si abres la app en varias pestañas, podrás simular varios jugadores que usan tu app.
  2. Comparte la app con otras personas usando el menú Compartir en la esquina superior derecha. Luego, usa la URL compartida de la pestaña Integraciones del menú Compartir para usar la app con los jugadores con los que la compartiste.

Prácticas recomendadas

  • Llamadas a la API de Gemini: Tu GEMINI_API_KEY se configura automáticamente como un secreto del servidor. Realiza llamadas a la API de Gemini desde el código del servidor con esta clave. Puedes verla en el panel Secretos.
  • Seguridad de secretos: Siempre usa el administrador de secretos para las claves sensibles. Nunca los codifiques en tus archivos.
  • Separación de intereses: Mantén la lógica de la IU en el framework del cliente (React/Angular) y la lógica empresarial o el manejo de datos en el servidor.
  • Manejo de errores: Asegúrate de que el código del servidor controle de forma sólida los errores de las llamadas a la API externa para evitar que la app falle.

¿Qué sigue?