Google uses AI technology to translate content into your preferred language. AI translations can contain errors.

Comando y control: Coordina el desarrollo de apps con Gemini y MCP

1. Introducción

En este lab práctico, practicarás habilidades de desarrollo modernas coordinando Antigravity para compilar una aplicación completa basada en la nube y aprenderás a usar las habilidades del agente y el MCP de conocimiento del desarrollador para mejorar el conocimiento del agente y la calidad del resultado.

Estamos creando el "Sistema de entrega de gatos", una aplicación que genera imágenes de gatos con Gemini 3.1 Flash Image, también conocido como Nano Banana 2. El backend de la aplicación se desarrollará con el SDK de Antigravity y se implementará en Cloud Run. También crearemos un frontend moderno con Lit y Vite. Todo esto sin escribir una sola línea de código de forma manual.

Qué aprenderás

Cómo trabajar con la CLI de Antigravity en modo rápido y de planificación
Cómo otorgar acceso a Antigravity a la documentación para desarrolladores de Google con el servidor de MCP de Developer Knowledge
Cómo instalar habilidades personalizadas en la CLI de Antigravity
Cómo usar Antigravity para implementar y auditar aplicaciones

Requisitos previos

Experiencia en el uso de una terminal
Leer y comprender el código
Conocimientos básicos sobre los agentes de codificación de IA
Conocimientos básicos de los conceptos de la nube

2. Configuración

Sigue las instrucciones que se indican a continuación para inicializar el proyecto de Google Cloud necesario para este codelab. Después de inicializar el proyecto, se recomienda que ejecutes este codelab en Cloud Shell, ya que incluye todas las herramientas necesarias para ejecutarlo de inmediato.

Si prefieres ejecutar este codelab en tu entorno local, deberás instalar Python, uv y un editor de código antes de continuar. Todas las instrucciones de este codelab suponen que lo ejecutas en Cloud Shell, a menos que se indique lo contrario.

Configuración del entorno de autoaprendizaje

Accede a consola de Google Cloud y crea un proyecto nuevo o reutiliza uno existente. Si aún no tienes una cuenta de Gmail o de Google Workspace, debes crear una.

El Nombre del proyecto es el nombre visible de los participantes de este proyecto. Es una cadena de caracteres que no se utiliza en las APIs de Google. Puedes actualizarla cuando quieras.
El ID del proyecto es único en todos los proyectos de Google Cloud y es inmutable (no se puede cambiar después de configurarlo). La consola de Cloud genera automáticamente una cadena única. Por lo general, no importa cuál sea. En la mayoría de los codelabs, deberás hacer referencia al ID de tu proyecto (suele identificarse como PROJECT_ID). Si no te gusta el ID que se generó, podrías generar otro aleatorio. También puedes probar uno propio y ver si está disponible. No se puede cambiar después de este paso y se usa el mismo durante todo el proyecto.
Recuerda que hay un tercer valor, un número de proyecto, que usan algunas APIs. Obtén más información sobre estos tres valores en la documentación.

A continuación, deberás habilitar la facturación en la consola de Cloud para usar las APIs o los recursos de Cloud. Ejecutar este codelab no costará mucho, tal vez nada. Para cerrar recursos y evitar que se generen cobros más allá de este instructivo, puedes borrar los recursos que creaste o borrar el proyecto. Los usuarios nuevos de Google Cloud son aptos para participar en el programa Prueba gratuita de $300.

Inicie Cloud Shell

Si bien Google Cloud y Spanner se pueden operar de manera remota desde tu laptop, en este codelab usarás Google Cloud Shell, un entorno de línea de comandos que se ejecuta en la nube.

En Google Cloud Console, haz clic en el ícono de Cloud Shell en la barra de herramientas en la parte superior derecha:

Activar Cloud Shell

El aprovisionamiento y la conexión al entorno deberían tomar solo unos minutos. Cuando termine el proceso, debería ver algo como lo siguiente:

Captura de pantalla de la terminal de Google Cloud Shell que muestra que el entorno se conectó

Esta máquina virtual está cargada con todas las herramientas de desarrollo que necesitarás. Ofrece un directorio principal persistente de 5 GB y se ejecuta en Google Cloud, lo que permite mejorar considerablemente el rendimiento de la red y la autenticación. Todo tu trabajo en este codelab se puede hacer en un navegador. No es necesario que instales nada.

3. Configura y autentica la CLI de Antigravity

En este lab, trabajarás con Antigravity (AGY). Es el agente de programación de Google que usa los modelos de Gemini de Google para ayudarte a crear software. Hay una aplicación de escritorio de AGY, una interfaz de línea de comandos (CLI de AGY) y un entorno de desarrollo integrado (IDE) que te permite ver y editar código junto con el agente. En este lab, usarás la CLI de AGY.

Además, también hay un SDK para crear tus propios agentes de uso general con el arnés del agente de Antigravity (piensa en el arnés como el motor de Antigravity).

Cómo lanzar y autenticar un AGY

Presiona el botón Abrir editor para abrir el editor de Cloud Shell.

Una vez que se abra el editor, puedes maximizar la ventana con el botón de maximizar en la barra de menú:

Abre el panel de la terminal con el menú Terminal > New Terminal o con la tecla de acceso rápido Ctrl +` (control más acento grave):

Se abrirá una nueva ventana de terminal en la parte inferior de la pantalla que mostrará el símbolo del sistema de bash:

Luego, en la terminal, crea un directorio de trabajo para tu primer ejercicio y cámbiate a él:

mkdir -p ~/hello-agy && cd ~/hello-agy

En esta terminal, escribe agy para iniciar la CLI de Antigravity:

agy

Una vez que se inicie agy, se te pedirá que te autentiques. Elige Usar un proyecto de Google Cloud:

Ahora, en la pantalla, se muestra un vínculo. Copia el vínculo proporcionado y pégalo en otra pestaña de tu navegador de incógnito.

Usa las mismas credenciales de estudiante proporcionadas para este lab para acceder.

Copia el código de autorización y pégalo de nuevo en agy:

Cuando se te solicite un ID del proyecto, debes usar el que se muestra en el panel lateral de esta página.

Por último, selecciona la ubicación de Google Cloud global:

Genera una secuencia de comandos rápida para devolver datos curiosos sobre gatos

Ahora, generemos un script rápido para tener una idea de cómo funciona la CLI de AGY.

Pídele a AGY que escriba una secuencia de comandos breve que muestre datos sobre gatos y que la ejecute por ti:

Write a simple node script that returns cat trivia and run it for me

AGY pensará durante un tiempo y escribirá el guion por ti.

Cuando AGY solicite permiso para ejecutar la secuencia de comandos del nodo, elige Sí y presiona Intro.

Así se veía la solicitud de permiso en mi caso:

Requesting permission for: node cat-trivia.js

Do you want to proceed?
> 1. Yes
  2. Yes, and always allow in this conversation for commands that start with 'node cat-trivia\.js'
  3. Yes, and always allow for commands that start with 'node cat-trivia\.js' (Persist to settings.json)
  4. No

Después de ejecutar la secuencia de comandos, AGY te brinda un resumen de lo que hizo. Esto es lo que me dijo:

I have created and executed a simple Node.js script that returns cat trivia.

### Created File

• cat-trivia.js: A standalone Node.js script that fetches random cat facts from a public API ( https://catfact.ninja/fact ) with built-in fallbacks and ASCII art.

### Execution Output

Running the script using  node cat-trivia.js  produced the following output:

     _._     _,-'""`-._
    (,-.`._,'(       |\`-/|
        `-.-' \ )-`( , o o)
              `-    \`_`"'-

    🐱 Here is your Cat Trivia:
    ----------------------------------------
    "In 1987 cats overtook dogs as the number one pet in America."
    ----------------------------------------

Me gusta que incluso agregó un dibujo ASCII de un gato para mí.

Ahora, es posible que quieras obtener más información sobre lo que creó para ti. Si bien puedes abrir el editor y revisar el código fuente (te recomiendo que lo hagas), también puedes pedirle a AGY que anote y explique el código:

Explain the code you generated please

Lee la explicación y haz preguntas adicionales si quieres saber más.

Por último, para finalizar esta tarea, cierra agy presionando Ctrl + D dos veces.

4. Conéctate a la documentación para desarrolladores de Google y realiza consultas

Si bien los agentes y los modelos son cada vez más inteligentes, la calidad de la respuesta depende en gran medida de la precisión y la actualización de sus conocimientos. Por eso, es importante proporcionarles herramientas para recuperar documentación para desarrolladores actualizada de una fuente autorizada, de modo que puedan evitar tomar decisiones incorrectas basadas en conocimientos internos o conjeturas.

El servidor de MCP de Google Developer Knowledge permite que los agentes de codificación busquen la documentación oficial para desarrolladores de Google sobre Firebase, Google Cloud, Android, Maps y muchos más productos de Google.

Si conectas tu agente directamente a la biblioteca oficial de documentación de Google, te aseguras de que el código y la orientación que usa estén actualizados y se basen en un contexto autorizado.

Para comenzar, habilita la API de Developer Knowledge:

gcloud services enable developerknowledge.googleapis.com

Configura el servidor de MCP de Developer Knowledge

Sigue los pasos que se indican a continuación para crear el espacio de trabajo de este proyecto y configurar el servidor de MCP de Developer Knowledge para Antigravity:

Los archivos de configuración de Antigravity para tu usuario se almacenan en la carpeta .gemini de tu directorio principal. En el siguiente diagrama, se muestra una versión simplificada con los elementos principales que encontrarás:

~/.gemini
├── antigravity/
├── antigravity-cli/
│   ├── brain/            # Conversations and artifacts
│   └── settings.json     # CLI settings
├── config/
│   ├── plugins/          # Global / shared plugins
│   └── mcp_config.json   # Global / shared MCP config
├── skills/               # Global / shared skills
│   └── {skill_name}/
│       ├── SKILL.md      # Skill definition
│       └── ...           # [optional] support files, scripts, etc.
└── GEMINI.md             # Global rules

Para agregar el servidor de MCP de Developer Knowledge a la CLI de AGY, edita el archivo mcp_config.json en la carpeta ~/.gemini/config.

Primero, asegúrate de que exista la carpeta de configuración y crea un archivo mcp_config.json vacío:

mkdir -p ~/.gemini/config && touch mcp_config.json

Luego, abre este archivo en el editor de Cloud Shell con el siguiente comando:

cloudshell edit ~/.gemini/config/mcp_config.json

Por último, agrega la siguiente configuración a mcp_config.json. Ten en cuenta que debes reemplazar [[PROJECT_ID]] por el ID de tu proyecto real. Puedes encontrar el ID del proyecto en el panel lateral de estas instrucciones.

~/.gemini/config/mcp_config.json

{
  "mcpServers": {
    "google-developer-knowledge": {
      "url": "https://developerknowledge.googleapis.com/mcp",
      "authProviderType": "google_credentials",
      "oauth": {
        "scopes": [
          "https://www.googleapis.com/auth/cloud-platform"
        ]
      },
      "timeout": 30000,
      "headers": {
        "X-goog-user-project": "[[PROJECT_ID]]"
      }
    }
  }
}

Ahora puedes verificar si el servidor de MCP se cargó correctamente con el comando de barra /mcp. Deberías ver algo como esto:

El MCP de Developer Knowledge está configurado. Ahora, veamos cómo funciona.

Genera una secuencia de comandos para crear fotos de gatos con Nano Banana 2

Creemos un script simple que genere imágenes de gatos con Nano Banana 2 para mostrar las capacidades de MCP de Developer Knowledge.

Deberás ejecutar los siguientes comandos en la terminal. Para cerrar agy, presiona Ctrl + D dos veces para volver a la shell.

Primero, habilita la API de AI Platform. Esta es la API que permite que tu proyecto realice llamadas a la API de Gemini:

gcloud services enable aiplatform.googleapis.com

Crea un espacio de trabajo para el generador de gatitos:

mkdir -p ~/nano-banana-kitten && cd ~/nano-banana-kitten

Inicializa el administrador de dependencias:

uv init

Ahora, inicia Antigravity y dale la siguiente instrucción:

Write a script that uses Nano Banana 2 through Vertex AI to generate a picture of a cute kitten, and run the script for me. Use the google-developer-knowledge MCP when researching.

Presiona Ctrl + O para expandir los pasos intermedios del pensamiento y leerlos. Deberías ver que AGY usa el servicio google-developer-knowledge para realizar consultas, escribir una secuencia de comandos, ejecutarla por ti y corregir los errores que encuentre.

Ver la imagen del gato =^_^=

5. Cómo compilar el agente de entrega de gatos

El MCP de conocimiento para desarrolladores de Google es útil para responder preguntas a través de la documentación oficial, pero, a veces, la información que necesitamos es muy especializada y no se puede encontrar en la documentación. En esas circunstancias, podemos usar otro estándar abierto: las habilidades del agente.

Las habilidades de los agentes son un formato abierto y ligero para ampliar las capacidades de los agentes de IA con conocimientos y flujos de trabajo especializados. La característica definitoria de una skill es lo que se denomina divulgación progresiva: en lugar de cargar todo el contenido de la skill desde el principio, el agente solo activará la skill cuando sea necesario, cargará la información requerida a pedido y ahorrará tokens valiosos.

Para completar el agente de entrega de gatos, emplearemos el SDK de Antigravity como arnés del agente. Para minimizar la fricción y optimizar la implementación del agente de codificación, también aprovecharemos la habilidad oficial del SDK de Antigravity.

Crea un espacio de trabajo y, luego, instala las dependencias

Primero, crea una carpeta para el proyecto final:

mkdir -p ~/cat-delivery && cd ~/cat-delivery

Luego, usa el administrador de paquetes uv para inicializar esta carpeta y, luego, instalar algunas dependencias:

uv init && uv add fastapi uvicorn

Instala la habilidad de Python del SDK de AGY

Para instalar habilidades desde el código fuente y los mercados abiertos, puedes usar la CLI de Skill de Vercel. Ejecuta el siguiente comando en la terminal para instalar la skill de google-antigravity-sdk. Asegúrate de ejecutarlo desde la carpeta del espacio de trabajo del lab (~/cdslab).

npx skills add Google-Antigravity/antigravity-sdk-python --skill google-antigravity-sdk --agent antigravity-cli --yes

El resultado de este comando debería verse así:

Ten en cuenta que el comando npx skills add Google-Antigravity/antigravity-sdk-python clonó automáticamente el repositorio antigravity-sdk-python de GitHub. Este comando se puede usar para instalar habilidades desde cualquier repositorio de GitHub, siempre y cuando tengan una carpeta skills.

Cómo instalar habilidades desde complementos

Otra forma de instalar habilidades es a través del sistema de complementos. Los complementos de Antigravity te permiten incluir no solo habilidades, sino también servidores de MCP, reglas y hooks en el mismo paquete. Son útiles para crear extensiones cohesivas en un solo paquete de implementación.

Como estamos creando una aplicación web, instala el complemento modern-web-guidance con el siguiente comando:

agy plugin install https://github.com/GoogleChrome/modern-web-guidance

Este complemento incluye una habilidad que contiene prácticas recomendadas para el desarrollo web escritas por el equipo de Google Chrome.

Vuelve a iniciar agy para que podamos ver esas habilidades en acción. En la instrucción de agy, escribe /skills para abrir el menú de habilidades:

/skills

Verás algo como lo siguiente:

Ahora que configuramos las habilidades del MCP y del agente, Antigravity está listo para trabajar en nuestro proyecto con toda la información que necesita para tener éxito.

Planificación de la app

La antigravedad tiene dos modos de funcionamiento: rápido y planificación. En el modo rápido, Antigravity comenzará a trabajar en la tarea de inmediato, y está diseñado para tareas más simples y autónomas. El modo de planificación está diseñado para tareas complejas, en las que el agente primero elaborará un plan que podrás revisar y modificar antes de comenzar la implementación.

Para habilitar el modo de planificación, puedes usar el comando de barra /planning:

/planning

Puedes volver al modo rápido con /fast:

/fast

Cuando alternes entre el modo de planificación y el modo rápido, también puede ser útil cambiar de modelo. Puedes hacerlo con el comando /model:

/model

La lista de modelos disponibles puede variar ligeramente según tu entorno y modo de autenticación:

Para el alcance de este instructivo, elige Gemini 3.5 Flash (Low). La palabra "bajo" entre paréntesis significa el nivel de pensamiento del modelo. Gemini 3.5 Flash con pensamiento bajo es un modelo muy rápido y eficaz con una buena economía de tokens. Si eliges Medio o Alto como nivel de razonamiento, se usarán más tokens y tiempo para razonar antes de que el modelo devuelva una respuesta.

Por ejemplo, en situaciones reales, podrías usar el modelo más capaz en el nivel de pensamiento Alto para la planificación y un modelo más rápido para la implementación. Sin embargo, para nuestro proyecto, Gemini 3.5 Flash (Low) es suficiente.

Generación del plan

Para volver a cambiar Antigravity al modo de planificación, haz lo siguiente:

/planning

Luego, envía la siguiente instrucción para crear el plan de implementación:

Create an application named "Cat Delivery System". This application will be an agent that generates cat pictures using Gemini 3.1 Flash Image (aka Nano Banana 2). The user will interact with the agent whenever it feels the need for a cat picture in their life, whether it be to make them smile, laugh or just brighten their day. Cat pictures can take any form the user desires: anime, cartoon, photorealistic, 3D render, etc. The only rule is ABSOLUTELY NO DOGS - steer the user towards cats if necessary. P.S.: capybaras are allowed.

The tech stack should be as follows:
- uv package manager
- Backend: agent using Antigravity SDK
- Frontend: simple chat window, light mode, lit / vite
- Model: Gemini 3.5 Flash for the root agent, Gemini 3.1 Flash Image for image generation

TODO:
- backend should serve a static frontend
- define the contract between frontend and backend before starting implementation
- use Google Cloud Project auth

Verás que, en la fase de investigación, Antigravity puede invocar tanto el MCP de conocimiento del desarrollador como una o más habilidades:

Una vez que el plan esté listo, se te pedirá que lo revises:

Presta atención a la esquina inferior derecha de la pantalla: hay un mensaje que dice 1 artefacto y la sugerencia de usar /artifact para revisarlo. En Antigravity, los archivos de asistencia, como planes, listas de tareas y explicaciones, se denominan "artefactos" para diferenciarlos de los archivos normales que forman parte de la solución (p.ej., código fuente).

Si ingresas el comando /artifact en la instrucción, podrás ver el plan y hacer comentarios sobre él en caso de que necesites realizar ajustes.

/artifact

Deberías ver algo como esto:

Ten en cuenta que hay un archivo llamado implementation_plan.md con las opciones para abrir, aprobar o rechazar. Presiona Intro para abrirlo. Este es un ejemplo de cómo se ve el plan en mi sistema:

Puedes desplazarte hacia arriba y hacia abajo con las teclas de flecha y, en cualquier línea, puedes agregar un comentario presionando la tecla C.

Una sección importante que debes revisar es la del "Plan de verificación". Aquí puedes verificar y agregar pasos de validación para que el modelo sepa que terminó la tarea.

Agrega comentarios al plan hasta que estés conforme con él y presiona ESC para volver. Luego, presiona Y para confirmar el envío de los comentarios al agente:

Después de presionar Y, el agente comenzará a trabajar de inmediato. El agente podría solicitar más confirmaciones de llamadas a herramientas a medida que avanza con la implementación.

Es posible que notes que la cantidad de artefactos aumentará con el tiempo. Además del plan, Antigravity también creará una lista de tareas (task.md) para hacer un seguimiento de cada elemento que debe implementar o de cada acción que debe realizar. Una vez que termine, creará un archivo de instrucciones (walkthrough.md) con una explicación de los objetivos alcanzados. Puedes inspeccionar todos estos elementos con el comando /artifact nuevamente.

En cualquier momento, puedes abrir estos archivos y agregar comentarios, que, cuando se envíen al agente, se pondrán en cola para su ejecución, al igual que una instrucción en cola. Se recomienda agregar comentarios a estos archivos para brindarle al agente contexto adicional sobre tu solicitud.

6. Implementa el agente en la nube

Ahora puedes implementarlo en la nube con Cloud Run. Como esta tarea no requiere un plan elaborado, podemos usar el modo rápido.

Cambia Antigravity al modo rápido con /fast:

/fast

Usa la siguiente instrucción para indicarle a Antigravity que implemente el agente de CDS en Cloud Run:

Deploy the agent and frontend to Cloud Run.

TODO:
- backend should serve a static frontend
- frontend and backend are deployed in the same container

Acceptance Criteria
- Agent is deployed to cloud run
- Frontend is live and renders with no errors
- Backend is live and responds to requests with no errors

7. ¡Felicitaciones!

En este taller, practicaste el desarrollo moderno con Antigravity, incluida la forma de extender sus capacidades con servidores de MCP y habilidades de agentes. También creaste una aplicación completa que aprovecha el SDK de Antigravity y Gemini 3.1 Flash Image. Tu recorrido de aprendizaje no tiene que terminar aquí: consulta otros codelabs en esta plataforma y sigue desarrollando tus habilidades de programación con agentes.