1. Panoramica
Da dove inizia oggi la creazione con l'AI? Per la maggior parte di noi, spesso inizia con una semplice domanda: "Posso prototipare rapidamente una soluzione al problema a cui sto pensando?". È qui che entra in gioco Google AI Studio. È un luogo in cui puoi creare rapidamente prototipi di qualsiasi cosa. In questo codelab, creeremo una semplice applicazione web utilizzando la codifica vibe ed eseguirne il deployment su Cloud Run.
Cosa creerai
Pronto a creare un'app web con il vibe code e a renderla disponibile per gli altri? Creeremo un'applicazione web ed eseguirne il deployment su Cloud Run, il tutto utilizzando solo AI Studio. Nell'ambito di questo lab, imparerai a:
- Crea una semplice applicazione web utilizzando la codifica vibe
- Verifica che l'applicazione funzioni come previsto
- Esegui il deployment dell'applicazione su Cloud Run
Requisiti
2. Prima di iniziare
- Nella console Google Cloud, nella pagina di selezione del progetto, seleziona o crea un progetto Google Cloud.
- Verifica che la fatturazione sia attivata per il tuo progetto Cloud. Scopri come verificare se la fatturazione è abilitata per un progetto .
- Se hai il link per utilizzare i crediti, puoi seguire le istruzioni riportate qui per utilizzarli.
3. Prototipo
Vai a Google AI Studio. Inizia a digitare il prompt che descrive l'applicazione che vuoi creare. Ecco il mio prompt:
Create a formal looking frontend application that has two buttons: "Snowflakes" and "Balloons". If the user clicks on the "Snowflakes" button, snowflakes of medium size should start falling on the screen from top to bottom for 5 seconds. If the user clicks on the "Balloons" button, balloons of medium size should start floating from the bottom of the screen and float to the top for 5 seconds.
Scegli il modello che preferisci. Qui utilizziamo Gemini 3 Pro (anteprima). Fai clic sul pulsante Crea.
In base a questa semplice descrizione, AI Studio creerà un'applicazione web che corrisponde esattamente alla descrizione che hai fornito. La generazione della richiesta richiede 2-3 minuti.
Se riscontri problemi con l'applicazione, non esitare a fornire prompt aggiuntivi che correggono il comportamento dell'applicazione. Ad esempio, aumenta le dimensioni del fiocco di neve fino al doppio delle dimensioni attuali.
Di seguito è riportato lo snapshot dell'applicazione generata:
4. Esegui il deployment in Cloud Run
Ora che l'applicazione è pronta, eseguiamo il deployment in Cloud Run.
- Fai clic sul pulsante a forma di razzo nell'angolo in alto a destra della pagina AI Studio. Quando passi il mouse sopra il pulsante, viene visualizzato il messaggio "Esegui il deployment dell'app".
- Si apre il popup **Deploy app on Google Cloud".
- Fai clic sul menu a discesa Seleziona un progetto Cloud.
- Seleziona il progetto dal menu a discesa. Se non riesci a trovare il tuo progetto nel menu a discesa, fai clic su Importa progetto e seleziona il progetto dal riquadro Importa progetto.
- Una volta selezionato il progetto, viene verificato che la fatturazione sia abilitata. Questa verifica verrà superata perché abbiamo collegato l'account di fatturazione al progetto nei passaggi iniziali.
- Fai clic sul pulsante Esegui il deployment dell'app e attendi che l'applicazione venga eseguita il deployment su Cloud Run.
Tieni presente che il nome del servizio Cloud Run verrà generato automaticamente.
- Il deployment dovrebbe completarsi in un paio di minuti e otterrai l'URL dell'app. Se fai clic sull'URL, puoi visualizzare l'applicazione web di cui è stato eseguito il deployment.
5. Esegui la pulizia
Per evitare che al tuo account Google Cloud vengano addebitati costi relativi alle risorse utilizzate in questo post, segui questi passaggi:
- Nella console Google Cloud, vai alla pagina Gestisci risorse.
- Nell'elenco dei progetti, seleziona il progetto che vuoi eliminare, quindi fai clic su Elimina.
- Nella finestra di dialogo, digita l'ID progetto, quindi fai clic su Chiudi per eliminare il progetto.
6. Complimenti
Complimenti! Hai completato correttamente il vibe coding di un'applicazione su AI Studio e ne hai eseguito il deployment su Cloud Run.
AI Studio è una piattaforma ideale per sviluppare e testare applicazioni, consentendo agli utenti di visualizzare immediatamente i loro progetti in azione.
L'integrazione perfetta di AI Studio con Cloud Run consente agli utenti di eseguire il deployment delle proprie applicazioni direttamente su Google Cloud. L'utilizzo di Cloud Run garantisce tutti i vantaggi intrinseci di un ambiente serverless, eliminando le complessità e l'overhead della gestione dell'infrastruttura.