1. Introduzione
In questo lab pratico eserciterai le competenze di sviluppo moderne orchestrando Antigravity per creare un'applicazione completa basata sul cloud e imparerai a utilizzare le skill dell'agente e la MCP Developer Knowledge per migliorare la conoscenza dell'agente e la qualità dell'output.
Stiamo creando il "Cat Delivery System", un'applicazione che genera immagini di gatti utilizzando Gemini 3.1 Flash Image, noto anche come Nano Banana 2. Il backend dell'applicazione verrà sviluppato utilizzando l'SDK Antigravity e verrà eseguito il deployment in Cloud Run. Creeremo anche un frontend moderno utilizzando lit e vite. Tutto questo senza scrivere manualmente una sola riga di codice.
Cosa imparerai a fare
- Come lavorare con la CLI di Antigravity in modalità veloce e pianificazione
- Come concedere ad Antigravity l'accesso alla documentazione per gli sviluppatori di Google utilizzando il server MCP per Developer Knowledge
- Come installare skill personalizzate in Antigravity CLI
- Come utilizzare Antigravity per eseguire il deployment e l'audit delle applicazioni
Prerequisiti
- Esperienza nell'utilizzo di un terminale
- Leggere e comprendere il codice
- Conoscenza di base degli agenti di programmazione AI
- Comprensione di base dei concetti di cloud
2. Configurazione
Segui le istruzioni riportate di seguito per inizializzare il progetto Google Cloud necessario per questo codelab. Dopo aver inizializzato il progetto, ti consigliamo di eseguire questo codelab su Cloud Shell, in quanto include tutti gli strumenti necessari per eseguirlo immediatamente.
Se preferisci eseguire questo codelab nel tuo ambiente locale, devi installare Python, uv e un editor di codice prima di procedere. Tutte le istruzioni di questo codelab presuppongono che tu lo esegua in Cloud Shell, se non diversamente indicato.
Configurazione dell'ambiente autonomo
- Accedi alla console Google Cloud e crea un nuovo progetto o riutilizzane uno esistente. Se non hai ancora un account Gmail o Google Workspace, devi crearne uno.
- Il nome del progetto è il nome visualizzato per i partecipanti a questo progetto. È una stringa di caratteri non utilizzata dalle API di Google. Puoi sempre aggiornarlo.
- L'ID progetto è univoco in tutti i progetti Google Cloud ed è immutabile (non può essere modificato dopo l'impostazione). La console Cloud genera automaticamente una stringa univoca, di solito non ti interessa di cosa si tratta. Nella maggior parte dei codelab, devi fare riferimento all'ID progetto (in genere identificato come
PROJECT_ID). Se non ti piace l'ID generato, puoi generarne un altro casuale. In alternativa, puoi provare a crearne uno e vedere se è disponibile. Non può essere modificato dopo questo passaggio e rimane per tutta la durata del progetto. - Per tua informazione, esiste un terzo valore, un numero di progetto, utilizzato da alcune API. Scopri di più su tutti e tre questi valori nella documentazione.
- Successivamente, dovrai abilitare la fatturazione in Cloud Console per utilizzare le risorse/API Cloud. Completare questo codelab non costa molto, se non nulla. Per arrestare le risorse ed evitare addebiti oltre a quelli previsti in questo tutorial, puoi eliminare le risorse che hai creato o il progetto. I nuovi utenti di Google Cloud possono beneficiare del programma prova senza costi di 300$.
Avvia Cloud Shell
Sebbene Google Cloud possa essere gestito da remoto dal tuo laptop, in questo codelab utilizzerai Google Cloud Shell, un ambiente a riga di comando in esecuzione nel cloud.
Nella console Google Cloud, fai clic sull'icona di Cloud Shell nella barra degli strumenti in alto a destra:
Bastano pochi istanti per eseguire il provisioning e connettersi all'ambiente. Al termine, dovresti vedere un risultato simile a questo:
Questa macchina virtuale è caricata con tutti gli strumenti per sviluppatori di cui avrai bisogno. Offre una home directory permanente da 5 GB e viene eseguita su Google Cloud, migliorando notevolmente le prestazioni e l'autenticazione della rete. Tutto il lavoro in questo codelab può essere svolto all'interno di un browser. Non devi installare nulla.
3. Configurazione e autenticazione di Antigravity CLI
In questo lab lavorerai con Antigravity (AGY). L'agente di programmazione di Google che utilizza i modelli Gemini di Google per aiutarti a creare software. Esiste un'applicazione desktop AGY, un'interfaccia a riga di comando (AGY CLI) e un ambiente di sviluppo integrato (IDE) che ti consente di visualizzare e modificare il codice insieme all'agente. In questo lab utilizzerai la CLI AGY.
Inoltre, è disponibile anche un SDK per creare agenti per uso generico personalizzati utilizzando l'infrastruttura agentica Antigravity (considera l'infrastruttura agentica come il motore di Antigravity).
Avvio e autenticazione di AGY
Premi il pulsante Apri editor per aprire l'editor di Cloud Shell.
Una volta aperto l'editor, puoi massimizzare la finestra utilizzando il pulsante Massimizza nella barra dei menu:
Apri il pannello del terminale utilizzando il menu Terminale > Nuovo terminale o il tasto di scelta rapida Ctrl+` (controllo più accento grave):
Nella parte inferiore dello schermo dovrebbe aprirsi una nuova finestra del terminale con il prompt bash:
Quindi, nel terminale, crea una directory di lavoro per il primo esercizio e passa a questa directory:
mkdir -p ~/hello-agy && cd ~/hello-agy
In questo terminale, digita agy per avviare Antigravity CLI:
agy
Una volta avviato agy, ti verrà chiesto di autenticarti. Scegli Utilizza un progetto Google Cloud:
Ora sullo schermo viene visualizzato un link. Copia il link fornito e incollalo in un'altra scheda del browser in incognito.
Utilizza le stesse credenziali studente fornite per questo lab per accedere.
Copia il codice di autorizzazione e incollalo di nuovo in agy:
Quando ti viene chiesto un ID progetto, devi utilizzare quello visualizzato nel riquadro laterale di questa pagina.
Infine, seleziona la località Google Cloud globale:
Genera un rapido script per restituire curiosità sui gatti
Ora generiamo un breve script per capire come funziona AGY CLI.
Chiedi ad AGY di scrivere un breve script che restituisca fatti sui gatti ed eseguilo:
Write a simple node script that returns cat trivia and run it for me
AGY penserà un po' e scriverà il copione per te.
Quando AGY richiede l'autorizzazione per eseguire lo script del nodo, scegli Sì e premi Invio.
Ecco come appariva la richiesta di autorizzazione per me:
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
Dopo aver eseguito lo script, AGY ti fornisce un riepilogo delle operazioni eseguite. Ecco cosa mi ha detto:
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."
----------------------------------------
Mi piace che abbia persino aggiunto un disegno ASCII di un gatto.
Ora potresti voler scoprire di più su ciò che ha creato per te. Anche se puoi aprire l'editor e ispezionare il codice sorgente (ti consiglio vivamente di farlo), puoi anche chiedere ad AGY di annotare e spiegarti il codice:
Explain the code you generated please
Leggi la spiegazione e fai domande aggiuntive se vuoi saperne di più.
Infine, per completare questa attività, chiudi agy premendo Ctrl+D due volte.
4. Connettersi ed eseguire query nella documentazione per sviluppatori Google
Anche se gli agenti e i modelli diventano sempre più intelligenti giorno dopo giorno, la qualità della risposta dipende in larga misura dall'accuratezza e dall'aggiornamento delle loro conoscenze. Per questo motivo, è importante fornire all'agente gli strumenti per recuperare la documentazione per sviluppatori aggiornata da una fonte autorevole, in modo che possa evitare di prendere decisioni errate basate su conoscenze interne o congetture.
Il server MCP Google Developer Knowledge consente agli agenti di codifica di cercare la documentazione ufficiale per sviluppatori di Google per Firebase, Google Cloud, Android, Maps e molti altri prodotti Google.
Se colleghi l'agente direttamente alla libreria ufficiale di documentazione di Google, ti assicuri che il codice e le indicazioni che utilizza siano aggiornati e basati su un contesto autorevole.
Per iniziare, abilita l'API Developer Knowledge:
gcloud services enable developerknowledge.googleapis.com
Configurare il server MCP per Developer Knowledge
Segui questi passaggi per creare lo spazio di lavoro per questo progetto e configurare il server MCP di Developer Knowledge per Antigravity:
I file di configurazione di Antigravity per il tuo utente sono archiviati nella cartella .gemini della tua home directory. Il diagramma seguente mostra una versione semplificata con gli elementi principali che troverai:
~/.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
Per aggiungere il server MCP di Developer Knowledge ad AGY CLI, modifica il file mcp_config.json nella cartella ~/.gemini/config.
Innanzitutto, assicurati che la cartella di configurazione esista e crea un file mcp_config.json vuoto:
mkdir -p ~/.gemini/config && touch mcp_config.json
Poi apri questo file nell'editor di Cloud Shell utilizzando il comando riportato di seguito:
cloudshell edit ~/.gemini/config/mcp_config.json
Infine, aggiungi la seguente configurazione a mcp_config.json. Tieni presente che devi sostituire [[PROJECT_ID]] con il tuo ID progetto effettivo. Puoi trovare l'ID progetto nel riquadro laterale di queste istruzioni.
~/.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]]"
}
}
}
}
Ora puoi verificare se il server MCP è stato caricato correttamente con il comando slash /mcp. Il risultato dovrebbe essere simile a questo:
Il server MCP per Developer Knowledge è configurato, ora vediamo come funziona.
Generare un prompt per creare immagini di gatti utilizzando Nano Banana 2
Creiamo un semplice script che genera immagini di gatti utilizzando Nano Banana 2 per mostrare le funzionalità di Developer Knowledge MCP.
Dovrai eseguire i seguenti comandi nel terminale. Puoi chiudere agy premendo Ctrl+D due volte per tornare alla shell.
Innanzitutto, abilita l'API AI Platform. Questa è l'API che consente al tuo progetto di effettuare chiamate all'API Gemini:
gcloud services enable aiplatform.googleapis.com
Crea un workspace per il generatore di gattini:
mkdir -p ~/nano-banana-kitten && cd ~/nano-banana-kitten
Inizializza il gestore delle dipendenze:
uv init
Ora avvia Antigravity e fornisci il seguente prompt:
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.
Premi Ctrl+O per espandere i passaggi di pensiero intermedi e leggerli. Dovresti vedere AGY utilizzare il servizio google-developer-knowledge per eseguire query, scrivere uno script, eseguirlo per te e correggere eventuali errori rilevati.
Visualizza l'immagine del gatto =^_^=
5. Creare l'agente di consegna dei gatti
La certificazione Google Developer Knowledge MCP è utile per rispondere alle domande tramite la documentazione ufficiale, ma a volte le informazioni di cui abbiamo bisogno sono molto specializzate e non si trovano nella documentazione. In questi casi, possiamo utilizzare un altro standard aperto: Agent Skills.
Le competenze degli agenti sono un formato leggero e aperto per estendere le funzionalità degli agenti AI con conoscenze e workflow specializzati. La caratteristica distintiva di una competenza è la cosiddetta disclosure progressiva: anziché caricare tutti i contenuti della competenza fin dall'inizio, l'agente attiverà la competenza solo quando necessario, caricando le informazioni richieste su richiesta e risparmiando token preziosi.
Per completare l'agente di consegna dei gatti, utilizzeremo l'SDK Antigravity come harness dell'agente. Per ridurre al minimo i problemi e semplificare l'implementazione per l'agente di programmazione, utilizzeremo anche la skill SDK Antigravity ufficiale.
Crea workspace e installa le dipendenze
Innanzitutto, crea una cartella per il progetto finale:
mkdir -p ~/cat-delivery && cd ~/cat-delivery
A questo punto, utilizza il gestore di pacchetti uv per inizializzare questa cartella e installare alcune dipendenze:
uv init && uv add fastapi uvicorn
Installare lo skill Python dell'SDK AGY
Per installare le skill dal codice sorgente e dai marketplace aperti, puoi utilizzare la CLI per le skill di Vercel. Esegui questo comando nel terminale per installare la skill google-antigravity-sdk. Assicurati di eseguirlo dalla cartella dello spazio di lavoro del lab (~/cdslab).
npx skills add Google-Antigravity/antigravity-sdk-python --skill google-antigravity-sdk --agent antigravity-cli --yes
L'output di questo comando dovrebbe essere simile al seguente:
Tieni presente che il comando npx skills add Google-Antigravity/antigravity-sdk-python ha clonato automaticamente il repository antigravity-sdk-python da GitHub. Questo comando può essere utilizzato per installare le skill da qualsiasi repository GitHub, purché contenga una cartella skills.
Installare le skill dai plug-in
Un altro modo per installare le skill è tramite il sistema di plug-in. I plug-in di Antigravity ti consentono di includere nello stesso pacchetto non solo le competenze, ma anche i server MCP, le regole e gli hook. Sono utili per creare estensioni coerenti in un unico bundle di deployment.
Poiché stiamo creando un'applicazione web, installa il plug-in modern-web-guidance utilizzando il comando riportato di seguito:
agy plugin install https://github.com/GoogleChrome/modern-web-guidance
Questo plug-in include una competenza che contiene le best practice per lo sviluppo web scritte dal team di Google Chrome.
Avvia agy di nuovo per vedere queste competenze in azione. Nel prompt di Agy, digita /skills per aprire il menu delle skill:
/skills
Visualizzerai qualcosa di simile a questo:
Ora che abbiamo configurato sia le competenze di MCP che quelle dell'agente, Antigravity è pronto per lavorare al nostro progetto con tutte le informazioni necessarie per riuscire.
Pianificare l'app
Antigravità ha due modalità di funzionamento: veloce e pianificazione. In modalità rapida, Antigravity inizierà subito a lavorare sull'attività ed è pensata per attività autonome più semplici. La modalità di pianificazione è pensata per attività complesse, in cui l'agente elabora prima un piano che puoi rivedere e modificare prima di iniziare l'implementazione.
Per attivare la modalità di pianificazione, puoi utilizzare il comando slash /planning:
/planning
Puoi tornare alla modalità veloce con /fast:
/fast
Quando passi dalla modalità di pianificazione a quella rapida, può essere utile anche cambiare modello. Puoi farlo utilizzando il comando /model:
/model
L'elenco dei modelli disponibili potrebbe essere leggermente diverso a seconda dell'ambiente e della modalità di autenticazione:
Ai fini di questo tutorial, scegli Gemini 3.5 Flash (basso). La parola "basso" tra parentesi indica il livello di ragionamento del modello. Gemini 3.5 Flash con Low thinking è un modello molto veloce ed efficace con una buona economia dei token. Se scegli Medio o Alto come livello di ragionamento, il modello utilizzerà più token e tempo per ragionare prima di fornire una risposta.
Ad esempio, in scenari reali potresti utilizzare il modello più avanzato nel livello di pensiero Alto per la pianificazione e un modello più veloce per l'implementazione. Tuttavia, per il nostro progetto Gemini 3.5 Flash (Low) è sufficiente.
Generazione del piano
Per tornare alla modalità di pianificazione di Antigravity:
/planning
Poi invia il seguente prompt per creare il piano di implementazione:
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
Vedrai che nella fase di ricerca Antigravity potrebbe richiamare sia l'MCP Developer Knowledge sia una o più skill:
Una volta completato il piano, ti verrà chiesto di esaminarlo:
Presta attenzione all'angolo in basso a destra dello schermo: è presente un messaggio che indica 1 artefatto e il suggerimento di utilizzare /artifact per la revisione. In Antigravity, i file di supporto come piani, elenchi di attività e procedure dettagliate sono chiamati "artefatti" per distinguerli dai normali file che fanno parte della soluzione (ad es. il codice sorgente).
Se inserisci il comando /artifact nel prompt, puoi visualizzare il piano e commentarlo nel caso in cui tu debba apportare modifiche.
/artifact
Il risultato dovrebbe essere simile a questo:
Tieni presente che esiste un file denominato implementation_plan.md con le opzioni per aprire, approvare o rifiutare. Premi Invio per aprirlo. Ecco un esempio di come appare il piano sul mio sistema:
Puoi scorrere verso l'alto e verso il basso con i tasti freccia e aggiungere un commento in qualsiasi riga premendo il tasto C.
Una sezione importante da controllare è "Piano di verifica". Qui puoi verificare e aggiungere passaggi di convalida in modo che il modello sappia di aver terminato l'attività.
Aggiungi commenti al piano finché non ti soddisfa e premi ESC per tornare indietro. Poi premi Y per confermare l'invio dei commenti all'agente:
Dopo aver premuto Y, l'agente inizierà immediatamente a lavorare. L'agente potrebbe chiedere ulteriori conferme delle chiamate di strumenti man mano che l'implementazione procede.
Potresti notare che il numero di artefatti aumenterà nel tempo. Oltre al piano, Antigravity creerà anche un elenco di attività (task.md) per tenere traccia di ogni elemento da implementare o azione da eseguire. Al termine, creerà un file di procedura dettagliata (walkthrough.md) con una spiegazione degli obiettivi raggiunti. Puoi esaminarli tutti utilizzando di nuovo il comando /artifact.
In qualsiasi momento puoi aprire questi file e aggiungere commenti, che, una volta inviati all'agente, verranno messi in coda per l'esecuzione proprio come un prompt in coda. È buona norma commentare questi file per fornire all'agente un contesto aggiuntivo sulla tua richiesta.
6. Esegui il deployment dell'agente nel cloud
Ora puoi eseguirne il deployment nel cloud utilizzando Cloud Run. Poiché questa attività non richiede un piano elaborato, possiamo utilizzare la modalità rapida.
Passa alla modalità veloce di Antigravity con /fast:
/fast
Utilizza il seguente prompt per indicare ad Antigravity di eseguire il deployment dell'agente CDS in 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. Complimenti!
In questo workshop hai fatto pratica con lo sviluppo moderno con Antigravity, imparando a estenderne le funzionalità con server MCP e skill dell'agente. Hai anche creato un'applicazione completa sfruttando l'SDK Antigravity e Gemini 3.1 Flash Image. Il tuo percorso di apprendimento non deve fermarsi qui: dai un'occhiata ad altri codelab su questa piattaforma e continua a sviluppare le tue competenze di programmazione con gli agenti.