Creazione di applicazioni nell'era dell'IA

1. Panoramica

In questo lab, utilizzerai i prodotti di AI generativa di Google per creare infrastrutture in Google Cloud con l'aiuto di Gemini Cloud Assist, eseguire query sui dati BigQuery utilizzando le funzionalità di linguaggio naturale in SQL di Data Canvas, scrivere codice nei notebook Jupyter di Colab Enterprise e in Eclipse Theia (Visual Studio Code) con l'aiuto di Gemini Code Assist e integrare le funzionalità di ricerca e chat AI basate su Cloud Storage e sulle origini di base di BigQuery in Vertex AI Agent Builder.

Il nostro obiettivo è creare un sito web di ricette e cucina chiamato AI Recipe Haven. Il sito verrà creato in Python e Streamlit e conterrà due pagine principali. Cooking Advice ospiterà un chatbot che creeremo utilizzando Gemini e una fonte di Vertex AI Agent Builder basata su un gruppo di libri di cucina. Offrirà consigli di cucina e risponderà a domande relative alla cucina. Recipe Search sarà un motore di ricerca alimentato da Gemini, questa volta basato su un database di ricette BigQuery.

Se hai difficoltà con il codice di questo esercizio, le soluzioni per tutti i file di codice si trovano nel repository GitHub dell'esercizio nel ramo solution.

Obiettivi

In questo lab imparerai a:

Attivare e utilizzare Gemini Cloud Assist
Crea un'app di ricerca in Vertex AI Agent Builder per il chatbot di consigli di cucina
Carica e pulisci i dati in un notebook Colab Enterprise con l'aiuto di Gemini Code Assist
Crea un'app di ricerca in Vertex AI Agent Builder per il generatore di ricette
Definisci la struttura dell'applicazione web principale Python e Streamlit, con un piccolo aiuto di Gemini
Esegui il deployment dell'applicazione web in Cloud Run
Collega la pagina Consigli di cucina alla nostra app per la creazione di agenti di ricerca di ricette
(Facoltativo) Collega la pagina di ricerca di ricette all'app Agent Builder per la ricerca di ricette
(Facoltativo) Esplora l'applicazione finale

2. Prerequisiti

Se non hai ancora un Account Google, devi crearne uno.
- Utilizza un account personale anziché un account di lavoro o della scuola. Gli account di lavoro e della scuola potrebbero avere limitazioni che impediscono l'attivazione delle API necessarie per questo lab.

3. Configurazione del progetto

Accedi alla console Google Cloud.
Abilita la fatturazione nella console Cloud.
- Il completamento di questo lab dovrebbe costare meno di 1 $in risorse cloud.
- Per evitare ulteriori addebiti, puoi seguire i passaggi alla fine di questo lab per eliminare le risorse.
- I nuovi utenti hanno diritto alla prova senza costi di 300$.
- Parteciperai a un evento di lab pratico virtuale? Potrebbe essere disponibile un credito di 5$.
Crea un nuovo progetto o scegli di riutilizzarne uno esistente.
Verifica che la fatturazione sia abilitata in I miei progetti nella fatturazione Cloud
- Se nel nuovo progetto viene visualizzato Billing is disabled nella colonna Billing account:
  1. Fai clic sui tre puntini nella colonna Actions.
  2. Fai clic su Modifica fatturazione.
  3. Seleziona l'account di fatturazione che vuoi utilizzare.
- Se partecipi a un evento dal vivo, è probabile che l'account si chiami Account di fatturazione di prova di Google Cloud Platform.

4. Attivare e utilizzare Gemini Cloud Assist

In questa attività attiveremo e utilizzeremo Gemini Cloud Assist. Mentre lavori nella console Google Cloud, Gemini Cloud Assist può offrirti consigli, aiutarti a creare, configurare e monitorare la tua infrastruttura Google Cloud e può persino suggerire comandi gcloud e scrivere script Terraform.

Per attivare Cloud Assist, fai clic nella casella di ricerca nella parte superiore della UI della console Cloud e seleziona Chiedi a Gemini o Chiedi a Gemini per la console Cloud.
Scorri fino alla sezione API obbligatoria della pagina e abilita l'API Gemini for Google Cloud.
Se non vedi subito un'interfaccia di chat, fai clic su Inizia a chattare. Inizia chiedendo a Gemini di spiegare alcuni dei vantaggi dell'utilizzo di Cloud Shell Editor. Dedica qualche minuto del tuo tempo a esplorare la risposta generata.
Poi, chiedi quali sono i vantaggi di Agent Builder e come può contribuire a rendere più concrete le risposte generative.
Infine, diamo un'occhiata a un confronto. Nella finestra della chat di Gemini della console Google Cloud, poni la seguente domanda:
```
What are the major steps to creating a search app grounded in a GCS data source using Vertex AI Agent builder?
```

5. Crea un'app di ricerca in Vertex AI Agent Builder per il chatbot di consigli di cucina

Il sito web che stiamo creando avrà una pagina di consigli di cucina contenente un chatbot progettato per aiutare gli utenti a trovare risposte a domande relative alla cucina. Sarà basato su Gemini e su una fonte contenente 70 libri di cucina di dominio pubblico. I libri di cucina fungeranno da fonte di riferimento che Gemini utilizza per rispondere alle domande.

Utilizza la casella di ricerca della console Cloud per andare a Vertex AI. Nella dashboard, fai clic su Abilita tutte le API consigliate. Questa operazione potrebbe richiedere alcuni minuti. Se viene visualizzata una finestra popup che indica che è necessario abilitare l'API Vertex AI, fai clic su Abilita. Una volta abilitate le API, puoi passare al passaggio successivo.
Utilizza la ricerca per andare su Agent Builder, quindi fai clic su Continua e attiva l'API.
Come suggerito da Gemini nella nostra precedente richiesta di consigli, la creazione di un'app di ricerca in Agent Builder inizia con la creazione di un'origine dati autorevole. Quando l'utente esegue una ricerca, Gemini comprende la domanda e come comporre risposte intelligenti, ma si basa sulla fonte di base per le informazioni utilizzate nella risposta, anziché attingere alle sue conoscenze innate.Dal menu a sinistra, vai a Data Store e Crea Data Store.
I libri di cucina di pubblico dominio che utilizziamo per la nostra pagina di consigli di cucina si trovano attualmente in un bucket Cloud Storage in un progetto esterno. Seleziona il tipo di origine Cloud Storage.
Esamina, ma non modificare, le opzioni predefinite relative al tipo di informazioni che importiamo. Lascia il tipo di importazione impostato su Cartella e per il percorso del bucket utilizza: labs.roitraining.com/labs/old-cookbooks, poi Continua.
Assegna un nome al datastore: old-cookbooks. Fai clic su MODIFICA, modifica l'ID in old-cookbooks-id e fai clic su Crea il datastore.

Vertex AI Agent Builder supporta diversi tipi di app e il datastore funge da fonte attendibile per ciascuno. Le app di ricerca sono utili per l'uso e la ricerca generici. Le app di chat sono destinate ai flussi generativi nelle applicazioni di chatbot/voicebot basate su Dataflow. Le app di consigli aiutano a creare motori per suggerimenti migliori. Le app Agente, invece, servono per creare agenti basati sull'AI generativa. Alla fine, l'agente probabilmente ci servirà al meglio per quello che vogliamo fare, ma dato che il prodotto è attualmente in anteprima, continueremo a utilizzare il tipo di app di ricerca.

Utilizza il menu a sinistra per andare ad App, quindi fai clic su Crea una nuova app.
Fai clic su Crea nella scheda Cerca il tuo sito web. Assegna un nome all'app cookbook-search. Fai clic su Modifica e imposta l'ID app su cookbook-search-id. Imposta la società su Google e fai clic su Continua.
Controlla il datastore old-cookbooks che hai creato qualche passaggio fa e Crea l'app di ricerca.

Se esamini la scheda Attività, probabilmente vedrai che i libri di cucina sono ancora in fase di importazione e indicizzazione. Agent Builder impiegherà più di 5 minuti per indicizzare le migliaia di pagine contenute nelle 70 ricette che gli abbiamo fornito. Mentre è in funzione, carichiamo e puliamo alcuni dati del database delle ricette per il nostro generatore di ricette.

6. Carica e pulisci i dati in un notebook Colab Enterprise con l'aiuto di Gemini Code Assist

Google Cloud offre due modi principali per lavorare con i notebook Jupyter. Utilizzeremo la nuova offerta di Google, Colab Enterprise. Alcuni di voi potrebbero conoscere il prodotto Colab di Google, comunemente utilizzato da privati e organizzazioni che vogliono sperimentare i notebook Jupyter in un ambiente senza costi. Colab Enterprise è un'offerta commerciale di Google Cloud completamente integrata con gli altri prodotti cloud di Google e che sfrutta appieno le funzionalità di sicurezza e conformità dell'ambiente GCP.

Una delle funzionalità offerte da Colab Enterprise è l'integrazione con Gemini Code Assist di Google. Code Assist può essere utilizzato in diversi editor di codice e può offrire consigli e suggerimenti in linea senza interruzioni durante la codifica. Sfrutteremo questo assistente generativo mentre organizziamo i dati delle nostre ricette.

Utilizza la ricerca per andare a Colab Enterprise e fai clic su Crea notebook. Se ricevi un'offerta per sperimentare nuove funzionalità di Colab, ignorala. Per avviare il runtime, la potenza di calcolo alla base del notebook, fai clic su Connetti nell'angolo in alto a destra del nuovo notebook.
Fai clic su File > Rinomina per rinominare il blocco note in Data Wrangling.
Fai clic su + Testo per creare una nuova casella di testo e utilizza la freccia su per spostarla in modo che sia la prima cella della pagina.

Modifica la casella di testo e inserisci:

# Data Wrangling

Import the Pandas library

Nel blocco di codice sotto il blocco di testo appena creato, inizia a digitare imp e Gemini Code Assist dovrebbe suggerire il resto dell'importazione in grigio. Premi Tab per accettare il suggerimento.
```
import pandas as pd
```

Sotto la casella del codice di importazione, crea un'altra casella di testo e inserisci:

Create a Pandas DataFrame from: gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv. View the first few records.

Crea e modifica un altro blocco di codice. Ancora una volta, inizia a digitare df = ed esamina il codice generato da Gemini Code Assist. Se visualizzi un elenco a discesa di completamento automatico delle parole chiave Python sopra il suggerimento generato, premi Esc per visualizzare il codice suggerito in grigio chiaro. Premi di nuovo Tab per accettare il suggerimento. Se il suggerimento non conteneva la chiamata alla funzione head(), aggiungila.
```
df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv')
df.head()
```
Fai clic sulla prima cella di codice, in cui hai importato Pandas, e utilizza il menu Comandi o la tastiera per eseguire la cella selezionata. Sulla tastiera, Maiusc+Invio esegue la cella e sposta lo stato attivo sulla cella successiva, creandone una se necessario. Attendi l'esecuzione della cella prima di procedere.NOTA: vedrai [ ] appena a sinistra quando una cella non è stata eseguita. Mentre una cella è in esecuzione, vedrai un'animazione rotante. Al termine della cella, viene visualizzato un numero, ad esempio [13].
Esegui la cella che carica il file CSV nel DataFrame. Attendi il caricamento del file ed esamina le prime cinque righe di dati. Questi sono i dati delle ricette che caricheremo in BigQuery e che alla fine utilizzeremo per basare il nostro generatore di ricette.
Crea un nuovo blocco di codice e inserisci il commento riportato di seguito. Dopo aver digitato il commento, passa alla riga di codice successiva e dovresti ricevere il suggerimento df.columns. Accettalo e poi esegui la cella.
```
# List the current DataFrame column names
```
Abbiamo appena dimostrato che hai davvero due opzioni per ricevere assistenza da Gemini Code Assist in un notebook Jupyter: celle di testo sopra le celle di codice o commenti all'interno della cella di codice stessa. I commenti all'interno delle celle di codice funzionano bene nei blocchi note Jupyter, ma questo approccio funziona anche in qualsiasi altro IDE che supporti l'Assistente codice Gemini di Google.
Facciamo un po' di pulizia delle colonne. Rinomina la colonna Unnamed: 0 in id e link in uri. Utilizza le tecniche di prompt e codice che preferisci per creare il codice, quindi esegui la cella quando sei soddisfatto.
```
# Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri'
df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True)
```
Rimuovi le colonne source e NER e utilizza head() per visualizzare le prime righe. Anche in questo caso, chiedi aiuto a Gemini. Esegui le ultime due righe ed esamina i risultati.
```
# Remove the source and NER columns
df.drop(columns=['source', 'NER'], inplace=True)
df.head()
```
Vediamo quanti record ci sono nel nostro set di dati. Ancora una volta, inizia con la tecnica di prompt che preferisci e vedi se riesci a chiedere a Gemini di aiutarti a generare il codice.
```
# Count the records in the DataFrame
df.shape # count() will also work
```
2,23 milioni di record sono probabilmente più ricette di quelle che abbiamo il tempo di preparare. Il processo di indicizzazione in Agent Builder richiederebbe probabilmente troppo tempo per l'esercizio di oggi. Come compromesso, campioniamo 150.000 ricette e lavoriamo con queste. Utilizza l'approccio prompt > codice per prendere il campione e archiviarlo in un nuovo DataFrame denominato dfs (s sta per small).
```
# Sample out 150,000 records into a DataFrame named dfs
dfs = df.sample(n=150000)
```
I dati di origine della ricetta sono pronti per essere caricati in BigQuery. Prima di eseguire il caricamento, andiamo su BigQuery e prepariamo un set di dati per contenere la nostra tabella. Nella console Google Cloud, utilizza la casella di ricerca per andare a BigQuery. Potresti fare clic con il tasto destro del mouse su BigQuery e aprirlo in una nuova scheda del browser.
Se non è già visibile, apri il riquadro della chat con Gemini AI utilizzando il logo di Gemini in alto a destra nella console Google Cloud. Se ti viene chiesto di abilitare di nuovo l'API, premi Abilita o aggiorna la pagina. Esegui il prompt: What is a dataset used for in BigQuery? Dopo aver esplorato la richiesta di risposta, How can I create a dataset named recipe_data using the Cloud Console? confronta i risultati con i passaggi successivi.
Nel riquadro di BigQuery Explorer, fai clic sul menu con tre puntini Visualizza azioni accanto al tuo ID progetto. Seleziona quindi Crea set di dati.
Fornisci il set di dati e l'ID di recipe_data. Lascia il tipo di località impostato su Stati Uniti e fai clic su Crea set di dati. Se ricevi un errore che indica che il set di dati esiste già, vai avanti.Con il set di dati creato in BigQuery, torniamo al notebook ed eseguiamo l'inserimento.
Torna al notebook di Data Wrangling in Colab Enterprise. In una nuova cella di codice, crea una variabile denominata project_id e utilizzala per memorizzare l'ID progetto attuale. Guarda in alto a sinistra in queste istruzioni, sotto il pulsante Termina lab, e troverai l'ID progetto attuale. Se preferisci, puoi trovarlo anche nella home page della console Cloud. Assegna il valore alla variabile project_id ed esegui la cella.
```
# Create a variable to hold the current project_id
project_id='YOUR_PROJECT_ID'
```
Utilizza l'approccio prompt > codice per creare un blocco di codice che inserirà il DataFrame dfs in una tabella denominata recipes nel set di dati che abbiamo appena creato recipe_data. Esegui la cella.
```
dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
```

7. Crea un'app di ricerca in Vertex AI Agent Builder per il generatore di ricette

Ottimo. Ora che abbiamo creato la tabella dei dati delle ricette, utilizziamola per creare un'origine dati basata su fatti concreti per il nostro generatore di ricette. L'approccio che utilizzeremo sarà simile a quello adottato per il nostro chatbot di cucina. Utilizzeremo Vertex AI Agent Builder per creare un datastore, che verrà poi utilizzato come fonte attendibile per un'app di ricerca.

Se vuoi, puoi chiedere a Gemini nella console Google Cloud di ricordarti i passaggi per creare un'app di ricerca Agent Builder oppure puoi seguire i passaggi elencati di seguito.

Utilizza la ricerca per andare ad Agent Builder. Apri Datastore e Crea datastore. Questa volta, seleziona il tipo di archivio dati BigQuery.
Nella cella di selezione della tabella, premi Sfoglia e cerca recipes. Seleziona il pulsante di opzione accanto alla tabella. Se vedi ricette di altri progetti qwiklabs-gcp-..., assicurati di selezionare quella che ti appartiene.NOTA: se fai clic su recipes anziché selezionare il pulsante di opzione accanto, si aprirà una nuova scheda nel browser e verrà visualizzata la pagina di panoramica della tabella in BigQuery. Basta chiudere la scheda del browser e selezionare il pulsante di opzione in Agent Builder.
Esamina, ma non modificare, le altre opzioni predefinite, poi fai clic su Continua.
Nella pagina di revisione dello schema, esamina le configurazioni predefinite iniziali, ma non modificare nulla. Continua
Assegna un nome al datastore recipe-data. Modifica l'ID datastore e impostalo su recipe-data-id. Crea il datastore.
Nel menu di navigazione a sinistra, vai ad App e fai clic su Crea una nuova app.
Fai clic su Crea nella scheda Cerca il tuo sito web. Assegna all'app il nome recipe-search e fai clic su MODIFICA per impostare l'ID su recipe-search-id. Imposta il nome dell'azienda su Google e fai clic su Continua.
Questa volta, controlla le origini dati recipe-data. Crea l'app.

L'indicizzazione della tabella del database richiederà un po' di tempo. Nel frattempo, proviamo il nuovo Data Canvas di BigQuery e vediamo se riusciamo a trovare una o due ricette interessanti.

Utilizza la casella di ricerca per andare a BigQuery. Nella parte superiore di BigQuery Studio, fai clic sulla Freccia giù accanto alla scheda più a destra e seleziona Canvas dei dati. Imposta la regione su us-central1.
Fai clic su Cerca i dati. Nella casella di ricerca del canvas dei dati, cerca recipes, premi Enter/Return per eseguire la ricerca e fai clic sul pulsante Aggiungi al canvas accanto al nome della tabella.
Una rappresentazione visiva della tabella delle ricette verrà caricata nel canvas di BigQuery Data. Puoi esplorare lo schema della tabella, visualizzare l'anteprima dei dati nella tabella ed esaminare altri dettagli. Sotto la rappresentazione della tabella, fai clic su Query.
Il canvas caricherà una finestra di dialogo per le query BigQuery più o meno tipica con un'aggiunta: sopra la finestra della query è presente una casella di testo che puoi utilizzare per chiedere aiuto a Gemini. Vediamo se riusciamo a trovare alcune ricette di torte nel nostro campione. Esegui il seguente prompt (digitando il testo e premendo Enter/Return per attivare la generazione SQL):
```
Please select the title and ingredients for all the recipes with a title that contains the word cake.
```
Esamina l'SQL generato. Quando il risultato ti soddisfa, esegui la query.
Niente male. Prima di andare avanti, prova a sperimentare con altri prompt e query. Quando fai esperimenti, prova prompt meno specifici per vedere cosa funziona e cosa no. Ad esempio, questo prompt:
```
Do I have any chili recipes?
```
(non dimenticare di eseguire la nuova query) Ha restituito un elenco di ricette di chili, ma ha omesso gli ingredienti finché non l'ho modificata in:
```
Do I have any chili recipes?  Please include their title and ingredients.
```
(Sì, dico per favore quando chiedo. Mia madre sarebbe così orgogliosa.) Ho notato che una ricetta del chili conteneva funghi e chi vuole i funghi nel chili? Ho chiesto a Gemini di aiutarmi a escludere queste ricette.
```
Do I have any chili recipes?  Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.
```

8. Apri editor di Cloud Shell

Vai all'editor di Cloud Shell.
Se il terminale non viene visualizzato nella parte inferiore dello schermo, aprilo:
- Fai clic sul menu a tre linee .
- Fai clic su Terminale.
- Fai clic su Nuovo terminale.

Nel terminale, imposta il tuo progetto con questo comando:

Formato:
```
gcloud config set project [PROJECT_ID]
```

Esempio:

gcloud config set project lab-project-id-example

Se non ricordi l'ID progetto:
- Puoi elencare tutti gli ID progetto con:
```
gcloud projects list | awk '/PROJECT_ID/{print $2}'
```

Se ti viene richiesto di concedere l'autorizzazione, fai clic su Autorizza per continuare.
Dovresti visualizzare questo messaggio:
```
Updated property [core/project].
```
Se visualizzi un WARNING e ti viene chiesto Do you want to continue (Y/N)?, probabilmente hai inserito l'ID progetto in modo errato. Premi N, premi Enter e prova a eseguire di nuovo il comando gcloud config set project.

9. Abilita API

Nel terminale, abilita le API:

gcloud services enable \
  compute.googleapis.com \
  sqladmin.googleapis.com \
  run.googleapis.com \
  artifactregistry.googleapis.com \
  cloudbuild.googleapis.com \
  networkconnectivity.googleapis.com \
  servicenetworking.googleapis.com \
  cloudaicompanion.googleapis.com

Se ti viene richiesto di concedere l'autorizzazione, fai clic su Autorizza per continuare. Fai clic per autorizzare Cloud Shell

Il completamento di questo comando potrebbe richiedere alcuni minuti, ma alla fine dovrebbe essere visualizzato un messaggio di operazione riuscita simile a questo:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

10. Definisci la struttura dell'applicazione web principale Python e Streamlit, con un piccolo aiuto di Gemini

Con l'indicizzazione di entrambi i nostri datastore di Vertex AI Agent Builder e con le nostre app di ricerca quasi pronte per il lancio, iniziamo a creare la nostra applicazione web.

Utilizzeremo Gemini Code Assist durante il lavoro. Per saperne di più sull'utilizzo di Gemini Code Assist in Visual Studio Code, consulta la documentazione qui.

Nel terminale dell'editor di Cloud Shell, esegui questo comando per clonare il repository dell'app di ricette.
```
git clone https://github.com/haggman/recipe-app
```
Esegui questo comando per aprire la cartella dell'applicazione nell'editor di Cloud Shell.
```
cloudshell open-workspace recipe-app/
```
Prima di esplorare la cartella clonata e iniziare a lavorare sulla nostra applicazione web, dobbiamo accedere a Google Cloud con il plug-in Cloud Code dell'editor e attivare Gemini. Facciamolo subito. In basso a sinistra nell'editor, fai clic su Cloud Code - Accedi. Se non vedi il link, attendi un minuto e ricontrolla.
Nella finestra del terminale verrà visualizzato un URL lungo. Apri l'URL nel browser e segui i passaggi per concedere a Cloud Code l'accesso al tuo ambiente Google Cloud. Nella finestra di dialogo finale, copia il codice di verifica e incollalo nella finestra del terminale in attesa nella scheda del browser dell'editor di Cloud Shell.
Dopo alcuni istanti, il link Cloud Code in basso a sinistra dell'editor cambierà in Cloud Code - No Project (Cloud Code - Nessun progetto). Fai clic sul nuovo link per selezionare un progetto. La tavolozza dei comandi dovrebbe aprirsi nella parte superiore dell'editor. Fai clic su Seleziona un progetto Google Cloud e seleziona il tuo progetto. Dopo qualche istante, il link in basso a sinistra dell'editor si aggiornerà per mostrare l'ID progetto. Ciò indica che Cloud Code è stato collegato correttamente al tuo progetto di lavoro.
Con Cloud Code connesso al tuo progetto, ora puoi attivare Gemini Code Assist. In basso a destra dell'interfaccia dell'editor, fai clic sul logo di Gemini barrato. Il riquadro di Gemini Chat si aprirà a sinistra dell'editor. Fai clic su Seleziona un progetto Google Cloud. Quando si apre la tavolozza dei comandi, seleziona il tuo progetto. Se hai seguito correttamente i passaggi (e Google non ha apportato modifiche), ora dovresti vedere una finestra di chat di Gemini attiva.
Ottimo. Con il terminale, la chat di Gemini e le configurazioni di Cloud Code impostati, apri la scheda Explorer e dedica qualche minuto a esplorare i file nel progetto corrente.

In Esplora risorse apri il file requirements.txt per modificarlo. Passa al riquadro della chat di Gemini e chiedi:

From the dependencies specified in the requirements.txt file, what type of application are we building?

Quindi, stiamo creando un'applicazione web interattiva utilizzando Python e Streamlit che interagisce con Vertex AI e Discovery Engine. Per ora, concentriamoci sui componenti dell'applicazione web. Come dice Gemini, Streamlit è un framework per la creazione di applicazioni web basate sui dati in Python. Ora chiedi:
```
Does the current project's folder structure seem appropriate for a Streamlit app?
```
È qui che Gemini tende ad avere problemi. Gemini può accedere al file attualmente aperto nell'editor, ma non può vedere l'intero progetto. Prova a chiedere:
```
Given the below, does the current project's file and folder structure seem appropriate for a Streamlit app?
- build.sh
- Home.py
- requirements.txt
- pages
-- Cooking_Advice.py
-- Recipe_Search.py
```
Vuoi una risposta migliore?
Vediamo alcune informazioni aggiuntive su Streamlit:
```
What can you tell me about Streamlit?
```
Bene, possiamo vedere che Gemini ci offre una bella panoramica, inclusi pro e contro.
Se volessi esplorare gli svantaggi, potresti chiedere:
```
What are the major downsides or shortcomings?
```
Nota: non abbiamo dovuto dire "di Streamlit" perché Gemini Chat è conversazionale (multi-turno). Gemini sa di cosa abbiamo parlato perché siamo in una sessione di chat. Se in qualsiasi momento vuoi cancellare la cronologia della chat con Gemini, utilizza l'icona del cestino nella parte superiore della finestra della chat di Gemini Code.

11. Esegui il deployment dell'applicazione web in Cloud Run

Ottimo, abbiamo la struttura dell'applicazione principale, ma funzionerà tutto? Ancora meglio, dove dobbiamo ospitarlo in Google Cloud?

Nella finestra della chat con Gemini, chiedi:

If I containerize this application, what compute technologies in Google Cloud would be best for hosting it?

Ricorda che, se non stavi già lavorando nel tuo IDE, puoi anche chiedere a Google Cloud Assist. Apri la console Google Cloud, poi apri Gemini Cloud Assist e chiedi:
```
If I have a containerized web application, where would be the best place to run it in Google Cloud?
```
I due gruppi di consigli erano gli stessi? Sei d'accordo o in disaccordo con uno dei consigli? Ricorda che Gemini è un assistente di AI generativa e, come un assistente umano, non sempre concorderai con tutto ciò che dice. Tuttavia, avere questo assistente sempre al tuo fianco mentre lavori in Google Cloud e nell'editor di codice può renderti molto più efficiente.
Per un'applicazione web containerizzata stateless di breve durata, Cloud Run è un'ottima opzione. Nella finestra della chat di Gemini dell'editor di codice, prova il prompt:
```
What steps would be required to run this application in Cloud Run?
```
Sembra che la prima cosa da fare sia creare un Dockerfile. Utilizzando l'editor, crea un file denominato Dockerfile nella radice della cartella del progetto. Assicurati di non inserirla accidentalmente nella cartella pagine. Apri il file per modificarlo.
Utilizziamo il riquadro laterale della chat di Gemini per creare il nostro Dockerfile. Utilizza un prompt come quello riportato di seguito. Quando i risultati vengono visualizzati nella chat, utilizza il segno + accanto all'icona di copia appena sopra il Dockerfile suggerito per inserire il codice suggerito nel Dockerfile.
```
Create a Dockerfile for the application in the current folder. The dependencies are defined in requirements.txt and I want you to use the Python 3 slim bookworm base image.
```
Gemini non restituisce sempre la stessa risposta allo stesso prompt. La prima volta che ho chiesto a Gemini un Dockerfile, ho ricevuto esattamente il file che ti suggerirò di utilizzare. Ho appena ricevuto il suggerimento:
```
# Base image
FROM python:3-bookworm-slim

# Set working directory
WORKDIR /app

# Install dependencies
RUN apt-get update && apt-get install -y \
    build-essential \
    libpq-dev \
    gcc \
    python3-dev \
    && rm -rf /var/lib/apt/lists/*

# Install pip and virtualenv
RUN pip install --upgrade pip virtualenv

# Create virtual environment
RUN python3 -m venv venv

# Activate virtual environment
WORKDIR /app/venv/bin
RUN . activate

# Install Streamlit and libraries from requirements.txt
RUN pip install -r requirements.txt

# Copy application files
COPY . /app

# Expose port 8501 for Streamlit
EXPOSE 8501

# Start Streamlit app
CMD ["streamlit", "run", "main.py"]
```
Questo è un Dockerfile davvero complesso. Lo semplificherei un po'. Non abbiamo bisogno della sezione apt-get perché tutto ciò che è necessario per Python è già presente nella nostra immagine di base. Inoltre, l'utilizzo di un ambiente virtuale in un container Python è uno spreco di spazio, quindi lo rimuoverei. Il comando expose non è strettamente necessario, ma va bene. Inoltre, sta cercando di avviare main.py, che non ho.

Nella cartella recipe-app, crea un file denominato Dockerfile e incolla questi contenuti:

FROM python:3.11-slim-bookworm

WORKDIR /app

COPY requirements.txt .
RUN pip install --no-cache-dir --upgrade pip && \
    pip install --no-cache-dir -r requirements.txt

COPY . .

CMD ["streamlit", "run", "Home.py"]

Gemini può operare tramite la finestra di chat, ma può anche funzionare direttamente nel file di codice utilizzando i commenti, come abbiamo fatto nel notebook Data Wrangling. Inoltre, può essere richiamato utilizzando Ctrl+i su Windows o Comando+i su Mac. Fai clic in un punto qualsiasi di Dockerfile, attiva Gemini utilizzando il comando Comando+i / Ctrl+i appropriato.
Nel prompt, inserisci quanto segue. Esamina e accetta la modifica.
```
Please comment the current file.
```
Non è fantastico? Quante volte hai dovuto lavorare con il codice di qualcun altro, solo per dover perdere tempo a capire il suo lavoro senza commenti prima di poter iniziare a apportare le tue modifiche. Arriva Gemini in soccorso.
Ora chiedi a Gemini come potresti utilizzare Cloud Run per creare e distribuire una nuova immagine denominata recipe-web-app dal Dockerfile nella cartella corrente.
```
How could I use gcloud to build a new Cloud Run service named recipe-web-app from the current directory?
```

Creiamo ed eseguiamo il deployment della nostra applicazione. Nella finestra del terminale, esegui il comando gcloud run deploy.

gcloud run deploy recipe-web-app \
    --allow-unauthenticated \
    --source=. \
    --region=us-central1 \
    --port=8501

Se viene visualizzato un prompt che chiede di creare un repository Artifact Registry, premi enter/return.

Deploying from source requires an Artifact Registry Docker repository to store built containers. A repository
named cloud-run-source-deploy in region us-central1 will be created.

Do you want to continue (Y/n)?

Se osservi il processo di build, per prima cosa verrà creato il repository Docker di Artifact Registry. Poi, utilizza Cloud Build per creare l'immagine container dal Dockerfile nella cartella locale. Infine, l'immagine Docker verrà implementata in un nuovo servizio Cloud Run. Alla fine dello script riceverai un URL di test di Cloud Run da utilizzare.

Apri il link restituito in una nuova scheda del browser. Prenditi un momento per esplorare la struttura e le pagine dell'applicazione. Bene, ora dobbiamo integrare la nostra funzionalità di AI generativa.

12. Collega la pagina Consigli di cucina alla nostra app per la creazione di agenti di ricerca di ricette

Il framework per l'applicazione web è in esecuzione, ma dobbiamo collegare le due pagine di lavoro alle nostre due app di ricerca Vertex AI Agent Builder. Iniziamo con Consigli di cucina.

Lascia aperta la scheda dell'editor di Cloud Shell. Nella console Google Cloud, utilizza la ricerca per andare a Chat in Vertex AI.
Nel riquadro della pagina delle impostazioni a destra, imposta il modello su gemini-1.5-flash-002. Aumenta il limite di token di output fino al massimo in modo che il modello possa restituire risposte più lunghe, se necessario. Apri le impostazioni del filtro di sicurezza. Imposta Incitamento all'odio, Contenuti sessualmente espliciti e Molestie su Blocca alcuni. Imposta Contenuti pericolosi su Blocca alcuni e fai clic su Salva. Abbiamo impostato Contenuti pericolosi su un livello leggermente inferiore perché parlare di coltelli e tagli può essere interpretato da Gemini come violenza.
Fai scorrere il pulsante di attivazione/disattivazione per attivare Grounding, quindi fai clic su Personalizza. Imposta l'origine del grounding su Vertex AI Search e utilizza il seguente percorso per il datastore. Modifica YOUR_PROJECT_ID con l'ID progetto che trovi vicino al pulsante Termina lab in queste istruzioni, quindi Salva le impostazioni di grounding.
```
projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id
```
NOTA: se ricevi un errore, significa che non hai modificato l'ID progetto con il tuo ID progetto effettivo oppure che hai saltato il passaggio in cui hai modificato l'ID datastore di Agent Builder old-cookbooks. Controlla il tuo Agent Builder > Datastore > old-cookbooks per l'ID datastore effettivo.
Prova a inviare un paio di messaggi di chat. Forse puoi iniziare con quanto segue. Se vuoi, prova anche qualche altro filtro.
```
How can I tell if a tomato is ripe?
```
Il modello funziona, ora sperimentiamo con il codice. Fai clic su Cancella conversazione in modo che le nostre conversazioni non facciano parte del codice, poi fai clic su Genera codice.
Nella parte superiore della finestra del codice, premi Apri notebook per sperimentare e perfezionare il codice in Colab Enterprise prima di integrarlo nella nostra app.
Prenditi qualche minuto per familiarizzare con il codice. Apportiamo un paio di modifiche per adattarlo a ciò che vogliamo. Prima di iniziare, esegui la prima cella di codice per connetterti al calcolo e installare l'SDK AI Platform. Dopo l'esecuzione del blocco, ti verrà chiesto di riavviare la sessione. Vai avanti e creale
Passa al codice estratto da Vertex AI Studio. Modifica il nome del metodo multiturn_generate_content in start_chat_session.
Scorri fino alla chiamata al metodo model = GenerativeModel(. Il codice esistente definisce generation_config e safety_settings, ma non li utilizza effettivamente. Modifica la creazione di GenerativeModel in modo che sia simile a:
```
model = GenerativeModel(
    "gemini-1.5-flash-002",
    tools=tools,
    generation_config=generation_config,
    safety_settings=safety_settings,
)
```

Infine, aggiungi una riga finale al metodo, appena sotto chat = model.start_chat(), in modo che la funzione restituisca l'oggetto chat. La funzione completata dovrebbe avere l'aspetto seguente.NOTA: NON COPIARE questo codice nel notebook. È presente solo come verifica del buono stato del servizio.

def start_chat_session():
    vertexai.init(project="qwiklabs-gcp-02-9a7298ceaaec", location="us-central1")
    tools = [
        Tool.from_retrieval(
            retrieval=grounding.Retrieval(
                source=grounding.VertexAISearch(datastore="projects/qwiklabs-gcp-02-9a7298ceaaec/locations/global/collections/default_collection/dataStores/old-cookbooks-id"),
            )
        ),
    ]
    model = GenerativeModel(
        "gemini-1.5-flash-002",
        tools=tools,
        generation_config=generation_config,
        safety_settings=safety_settings,
    )
    chat = model.start_chat()
    return chat

Scorri fino alla fine della cella di codice e modifica l'ultima riga che chiama la vecchia funzione in modo che chiami il nuovo nome della funzione e memorizzi l'oggetto restituito in una variabile chat. Una volta completate le modifiche, esegui la cella.
```
chat = start_chat_session()
```
Crea una nuova cella di codice e aggiungi il commento # Use chat to invoke Gemini and print out the response. Passa alla riga successiva e digita resp. Gemini dovrebbe completare automaticamente il blocco. Aggiorna il prompt a How can I tell if a tomato is ripe?. Esegui la cella
```
response = chat.send_message("How can I tell if a tomato is ripe?")
print(response)
```
Questa è la risposta corretta, ma la parte che ci interessa davvero è il campo text nidificato. Modifica il blocco di codice per stampare solo quella sezione, ad esempio:
```
response = chat.send_message("How can I tell if a tomato is ripe?")
print(response.candidates[0].content.parts[0].text)
```
Bene, ora che abbiamo il codice di chat funzionante, integriamolo nella nostra applicazione web. Copia tutto il contenuto della cella di codice che crea la funzione start_chat_session (non avremo bisogno della cella di test). Se fai clic sulla cella, puoi fare clic sul menu con tre puntini nell'angolo in alto a destra e copiare da lì
Passa alla scheda dell'editor di Cloud Shell e apri pages\Cooking_Advice.py per la modifica.

Individua il commento:

#
# Add the code you copied from your notebook below this message
#

Incolla il codice copiato appena sotto il commento Aggiungi il codice. Bene, ora abbiamo la sezione che gestisce il motore di chat tramite una chiamata basata su Gemini. Ora integriamolo in Streamlit.

Individua la sezione di codice commentato direttamente sotto il commento:

#
# Here's the code to setup your session variables
# Uncomment this block when instructed
#

Rimuovi il commento da questa sezione di codice (fino alla sezione Setup done, let's build the page UI successiva) ed esplorala. Crea o recupera le variabili di sessione della chat e della cronologia.
Successivamente, dobbiamo integrare la funzionalità di cronologia e chat nell'UI. Scorri il codice fino a individuare il commento riportato di seguito.
```
#
# Here's the code to create the chat interface
# Uncomment the below code when instructed
#
```
Rimuovi il commento dal resto del codice sotto il commento e prenditi un momento per esplorarlo. Se vuoi, evidenzialo e chiedi a Gemini di spiegarti la sua funzionalità.
Ottimo, ora creiamo l'applicazione ed eseguiamo il deployment. Quando l'URL viene restituito, avvia l'applicazione e prova la pagina Cooking Advisor. Magari chiedi informazioni sui pomodori maturi o se il bot conosce un buon modo per preparare i cavoletti di Bruxelles.
```
gcloud run deploy recipe-web-app \
    --allow-unauthenticated \
    --source=. \
    --region=us-central1 \
    --port=8501
```

Incredibile, vero Il tuo consulente di cucina personale con l'AI :-)

13. (Facoltativo) Collega la pagina di ricerca di ricette all'app Agent Builder per la ricerca di ricette

Quando abbiamo collegato la pagina Consigli di cucina alla sua fonte di base, lo abbiamo fatto utilizzando direttamente l'API Gemini. Per la ricerca di ricette, connettiamoci direttamente all'app di ricerca di Vertex AI Agent Builder.

Nell'editor di Cloud Shell, apri la pagina pages/Recipe_Search.py per la modifica. Esamina la struttura della pagina.
Verso la parte superiore del file, imposta l'ID progetto.
Esamina la funzione search_sample. Questo codice proviene più o meno direttamente dalla documentazione di Discovery Engine qui. Puoi trovare una copia funzionante in questo blocco note qui.L'unica modifica che ho apportato è stata quella di restituire response.results anziché solo i risultati. Senza questo, il tipo restituito è un oggetto progettato per scorrere le pagine dei risultati, cosa che non ci serve per la nostra applicazione di base.
Scorri fino alla fine del file e rimuovi il commento dall'intera sezione sottostante Here are the first 5 recipes I found.
Evidenzia l'intera sezione che hai appena decommentato e apri la chat di Gemini Code. Chiedi a Explain the highlighted code. Se non hai selezionato nulla, Gemini può spiegarti l'intero file. Se evidenzi una sezione e chiedi a Gemini di spiegarla, commentarla o migliorarla, Gemini lo farà.Leggi attentamente la spiegazione. Per quello che può valere, l'utilizzo di un notebook Colab Enterprise è un ottimo modo per esplorare le API Gemini prima di integrarle nella tua applicazione. È particolarmente utile per esplorare alcune delle API più recenti che potrebbero non essere documentate nel modo migliore.
Nella finestra del terminale dell'editor, esegui build.sh per eseguire il deployment dell'applicazione finale. Attendi il deployment della nuova versione prima di procedere con il passaggio successivo.

14. (Facoltativo) Esplora l'applicazione finale

Prenditi qualche minuto per esplorare l'applicazione finale.

Nella console Google Cloud, utilizza la ricerca per andare a Cloud Run, quindi fai clic su recipe-web-app.
Individua l'URL di test dell'applicazione (nella parte superiore) e aprilo in una nuova scheda del browser.
Dovrebbe apparire la home page dell'applicazione. Prendi nota del layout e della navigazione di base forniti da Streamlit, con i file Python della cartella pages visualizzati come scelte di navigazione e Home.py caricato come home page. Vai alla pagina Consigli di cottura.
Dopo qualche istante, verrà visualizzata l'interfaccia della chat. Ancora una volta, nota il layout di base fornito da Streamlit.

Prova a fare qualche domanda sulla cucina e vedi come funziona il bot. Qualcosa del tipo:

Do you have any advice for preparing broccoli?

How about a classic chicken soup recipe?

Tell me about meringue.

Ora troviamo una o due ricette. Vai alla pagina di ricerca delle ricette e prova a eseguire qualche ricerca. Qualcosa del tipo:
```
Chili con carne

Chili, corn, rice

Lemon Meringue Pie

A dessert containing strawberries
```

15. Complimenti!

Hai creato un'applicazione che utilizza le applicazioni Vertex AI Agent Builder. Durante il percorso, hai esplorato Gemini Cloud Assist, Gemini Code Assist e le funzionalità di conversione del linguaggio naturale in SQL del canvas di dati di BigQuery. Ottimo lavoro.

Esegui la pulizia

Cloud SQL non ha un livello senza costi e ti addebiterà un costo se continui a utilizzarlo. Puoi eliminare il tuo progetto Cloud per evitare addebiti aggiuntivi.

Sebbene non siano previsti addebiti per Cloud Run quando il servizio non è in uso, ti potrebbero comunque essere addebitati i costi di archiviazione dell'immagine container in Artifact Registry. L'eliminazione del progetto Cloud interrompe la fatturazione per tutte le risorse utilizzate al suo interno.

Se vuoi, elimina il progetto:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

Potresti anche voler eliminare le risorse non necessarie dal disco Cloud Shell. Puoi:

Elimina la directory del progetto codelab:
```
rm -rf ~/task-app
```
Attenzione. La prossima azione non può essere annullata. Se vuoi eliminare tutti i contenuti di Cloud Shell per liberare spazio, puoi eliminare l'intera home directory. Fai attenzione che tutto ciò che vuoi conservare sia salvato altrove.
```
sudo rm -rf $HOME
```