Se usó la API de Cloud Translation para traducir esta página.

Cómo compilar aplicaciones en la era de la IA

1. Descripción general

En este lab, usarás los productos de IA generativa de Google para crear infraestructura en Google Cloud con la ayuda de Gemini Cloud Assist, consultar datos de BigQuery con lenguaje natural a las funciones de SQL de Data Canvas, escribir código en notebooks de Jupyter de Colab Enterprise y en Eclipse Theia (Visual Studio Code) con la ayuda de Gemini Code Assist, y también integrarás funciones de búsqueda y chat de IA compiladas en Cloud Storage y fuentes de base de BigQuery en Vertex AI Agent Builder.

Nuestro objetivo es crear un sitio web de recetas y cocina llamado AI Recipe Haven. El sitio se compilará en Python y Streamlit, y contendrá dos páginas principales. Cooking Advice alojará un chatbot que crearemos con Gemini y una fuente basada en Vertex AI Agent Builder vinculada a un grupo de libros de recetas. Ofrecerá consejos de cocina y responderá preguntas relacionadas con la cocina. Recipe Search será un motor de búsqueda alimentado por Gemini, esta vez basado en una base de datos de recetas de BigQuery.

Si tienes problemas con alguno de los códigos de este ejercicio, las soluciones para todos los archivos de código se encuentran en el repositorio de GitHub del ejercicio, en la rama solution.

Objetivos

En este lab, aprenderás a realizar las siguientes tareas:

Activa y usa Gemini Cloud Assist
Crea una app de búsqueda en Vertex AI Agent Builder para el chatbot de consejos de cocina
Carga y limpia datos en un notebook de Colab Enterprise con la ayuda de Gemini Code Assist
Crea una app de búsqueda en Vertex AI Agent Builder para el generador de recetas
Define la aplicación web principal de Python y Streamlit con un poco de ayuda de Gemini
Implementa la aplicación web en Cloud Run
Conecta la página de Cooking Advice a nuestra app de Agent Builder de búsqueda de libros de recetas
(Opcional) Conecta la página de búsqueda de recetas a la app de Agent Builder de búsqueda de recetas
Explora la aplicación final (opcional)

2. Requisitos previos

Si aún no tienes una Cuenta de Google, debes crear una.
- Usa una cuenta personal en lugar de una cuenta de trabajo o de institución educativa. Es posible que las cuentas de trabajo o de instituciones educativas tengan restricciones que te impidan habilitar las APIs necesarias para este lab.

3. Configura el proyecto

Accede a la consola de Google Cloud.
Habilita la facturación en la consola de Cloud.
- Completar este lab debería costar menos de USD 1 en recursos de Cloud.
- Puedes seguir los pasos que se indican al final de este lab para borrar recursos y evitar cargos adicionales.
- Los usuarios nuevos son aptos para la prueba gratuita de USD 300.
- ¿Asistes a un evento de lab práctico virtual? Es posible que haya un crédito de USD 5 disponible.
Crea un proyecto nuevo o elige reutilizar uno existente.
Confirma que la facturación esté habilitada en Mis proyectos en la Facturación de Cloud
- Si tu proyecto nuevo dice Billing is disabled en la columna Billing account, haz lo siguiente:
  1. Haz clic en los tres puntos de la columna Actions.
  2. Haz clic en Cambiar la facturación.
  3. Selecciona la cuenta de facturación que quieres usar.
- Si asistes a un evento en vivo, es probable que la cuenta se llame Cuenta de facturación de prueba de Google Cloud Platform.

4. Activa y usa Gemini Cloud Assist

En esta tarea, activaremos y usaremos Gemini Cloud Assist. Mientras trabajas en la consola de Google Cloud, Gemini Cloud Assist puede ofrecerte consejos, ayudarte a compilar, configurar y supervisar tu infraestructura de Google Cloud, y hasta sugerir comandos gcloud y escribir secuencias de comandos de Terraform.

Para activar Cloud Assist y comenzar a usarlo, haz clic en el cuadro de búsqueda en la parte superior de la IU de Cloud Console y selecciona Ask Gemini o Ask Gemini for Cloud console.
Desplázate hasta la sección API requerida de la página y Habilita la API de Gemini para Google Cloud.
Si no ves una interfaz de chat de inmediato, haz clic en Empieza a chatear. Comienza por pedirle a Gemini que explique algunos de los beneficios de usar el editor de Cloud Shell. Tómate unos minutos para explorar la respuesta generada.
A continuación, pregunta sobre los beneficios de Agent Builder y cómo puede ayudar a fundamentar las respuestas generativas.
Por último, veamos una comparación. En la ventana de chat de Gemini de la consola de Google Cloud, haz la siguiente pregunta:
```
What are the major steps to creating a search app grounded in a GCS data source using Vertex AI Agent builder?
```

5. Crea una app de búsqueda en Vertex AI Agent Builder para el chatbot de consejos de cocina

El sitio web que estamos creando tendrá una página de consejos de cocina que contiene un chatbot diseñado para ayudar a los usuarios a encontrar respuestas a preguntas relacionadas con la cocina. Se basará en Gemini y en una fuente que contiene 70 libros de recetas de dominio público. Los libros de recetas actuarán como la fuente de información que usa Gemini para responder preguntas.

Usa el cuadro de búsqueda de la consola de Cloud para navegar a Vertex AI. En el panel, haz clic en Habilitar todas las APIs recomendadas. Es posible que este proceso demore unos minutos. Si aparece un cuadro emergente sobre la necesidad de habilitar la API de Vertex AI, también habilítala. Una vez que se habiliten las APIs, puedes continuar con el siguiente paso.
Usa la búsqueda para navegar a Agent Builder y, luego, Continuar y activar la API.
Como sugirió Gemini en nuestra búsqueda de consejos anterior, crear una app de búsqueda en Agent Builder comienza con la creación de una fuente de datos confiable. Cuando el usuario realiza una búsqueda, Gemini comprende la pregunta y cómo redactar respuestas inteligentes, pero buscará la información que se usa en esa respuesta en la fuente basada en hechos, en lugar de extraerla de su conocimiento innato.En el menú de la izquierda, navega a Almacenes de datos y Crear almacén de datos.
Los libros de cocina de dominio público que usamos para fundamentar nuestra página de consejos de cocina se encuentran actualmente en un bucket de Cloud Storage en un proyecto externo. Selecciona el tipo de fuente de Cloud Storage.
Examina, pero no cambies las opciones predeterminadas relacionadas con el tipo de información que importaremos. Deja el tipo de importación configurado en Carpeta y, para la ruta de acceso del bucket, usa: labs.roitraining.com/labs/old-cookbooks y, luego, Continuar.
Asigna el nombre old-cookbooks al almacén de datos. Haz clic en EDITAR y cambia el ID a old-cookbooks-id y Crea el almacén de datos.

Vertex AI Agent Builder admite varios tipos de apps, y el almacén de datos actúa como la fuente de información de cada una. Las apps de búsqueda son buenas para el uso general y la búsqueda. Las apps de chat son para flujos generativos en aplicaciones de chatbot o voicebot impulsadas por Dataflow. Las apps de recomendaciones ayudan a crear mejores motores de recomendaciones. Además, las apps de agentes se usan para crear agentes impulsados por la IA generativa. Con el tiempo, es probable que el agente sea más útil para lo que queremos hacer, pero, como el producto está en versión preliminar, nos quedaremos con el tipo de app de búsqueda.

Usa el menú de la izquierda para navegar a Apps y, luego, haz clic en Create A New App.
Haz clic en Crear en la tarjeta Busca tu sitio web. Asígnale el nombre cookbook-search a la app. Haz clic en Editar y establece el ID de app en cookbook-search-id. Establece la empresa en Google y haz clic en Continuar.
Revisa el almacén de datos old-cookbooks que creaste hace unos pasos y crea la app de búsqueda.

Si examinas la pestaña Actividad, es probable que veas que los libros de recetas aún se están importando y indexando. Agent Builder tardará más de 5 minutos en indexar las miles de páginas contenidas en los 70 libros de recetas que le proporcionamos. Mientras funciona, carguemos y limpiemos algunos datos de la base de datos de recetas para nuestro generador de recetas.

6. Carga y limpia datos en un notebook de Colab Enterprise con la ayuda de Gemini Code Assist

Google Cloud ofrece dos formas principales de trabajar con notebooks de Jupyter. Usaremos la oferta más reciente de Google, Colab Enterprise. Es posible que algunos de ustedes estén familiarizados con el producto Colab de Google, que suelen usar las personas y organizaciones que desean experimentar con notebooks de Jupyter en un entorno gratuito. Colab Enterprise es una oferta comercial de Google Cloud que está completamente integrada con el resto de los productos en la nube de Google y que aprovecha al máximo las capacidades de seguridad y cumplimiento del entorno de GCP.

Una de las funciones que ofrece Colab Enterprise es la integración con Gemini Code Assist de Google. La función de asistencia de código se puede usar en varios editores de código y puede ofrecer sugerencias intercaladas y sin inconvenientes mientras escribes código. Aprovecharemos este asistente generativo mientras organizamos nuestros datos de recetas.

Usa la búsqueda para navegar a Colab Enterprise y haz clic en Create notebook. Si recibes una oferta para experimentar con nuevas funciones de Colab, ignórala. Para que el entorno de ejecución, la potencia de procesamiento detrás del notebook, esté listo, haz clic en Conectar en la esquina superior derecha del notebook nuevo.
Haz clic en File > Rename para cambiar el nombre del notebook a Data Wrangling.
Haz clic en + Texto para crear un nuevo cuadro de texto y usa la flecha hacia arriba para moverlo de modo que sea la primera celda de la página.

Edita el cuadro de texto y escribe lo siguiente:

# Data Wrangling

Import the Pandas library

En el bloque de código debajo del bloque de texto que acabas de crear, comienza a escribir imp y Gemini Code Assist debería sugerir el resto de la importación en gris. Presiona Tab para aceptar la sugerencia.
```
import pandas as pd
```

Debajo del cuadro de código de importación, crea otro cuadro de texto y escribe lo siguiente:

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

Crea y edita otro bloque de código. Una vez más, comienza a escribir df = y examina el código generado por Gemini Code Assistant. Si ves una lista desplegable de autocompletado de palabras clave de Python sobre la sugerencia generada, presiona Escape para ver el código sugerido en gris claro. Vuelve a presionar Tab para aceptar la sugerencia. Si tu sugerencia no contenía la llamada a la función head(), agrégala.
```
df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv')
df.head()
```
Haz clic en la primera celda de código, en la que importaste Pandas, y usa el menú Commands o el teclado para ejecutar la celda seleccionada. En el teclado, Mayúsculas + Intro ejecutará la celda y cambiará el enfoque a la siguiente celda, y creará una si es necesario. Espera a que se ejecute la celda antes de continuar.NOTA: Verás [ ] a la izquierda cuando una celda no se haya ejecutado. Mientras se ejecuta una celda, verás una animación giratoria en funcionamiento. Una vez que termine la celda, aparecerá un número, como [13].
Ejecuta la celda que carga el CSV en el DataFrame. Espera a que se cargue el archivo y examina las primeras cinco filas de datos. Estos son los datos de recetas que cargaremos en BigQuery y, con el tiempo, los usaremos para fundamentar nuestro generador de recetas.
Crea un nuevo bloque de código y escribe el siguiente comentario. Después de escribir el comentario, ve a la siguiente línea de código y deberías recibir la sugerencia df.columns. Acepta la celda y, luego, ejecútala.
```
# List the current DataFrame column names
```
Acabamos de demostrar que realmente tienes dos opciones para obtener ayuda de Gemini Code Assist en un notebook de Jupyter: celdas de texto sobre celdas de código o comentarios dentro de la celda de código. Los comentarios dentro de las celdas de código funcionan bien en los notebooks de Jupyter, pero este enfoque también funcionará en cualquier otro IDE que admita la asistencia de Gemini Code de Google.
Hagamos un poco de limpieza de columnas. Cambia el nombre de la columna Unnamed: 0 a id y el de link a uri. Usa la instrucción que elijas > técnicas de código para crear el código y, luego, ejecuta la celda cuando estés conforme.
```
# Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri'
df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True)
```
Quita las columnas source y NER y usa head() para ver las primeras filas. Una vez más, pídele ayuda a Gemini. Ejecuta las últimas dos líneas y examina los resultados.
```
# Remove the source and NER columns
df.drop(columns=['source', 'NER'], inplace=True)
df.head()
```
Veamos cuántos registros hay en nuestro conjunto de datos. Una vez más, comienza con la técnica de instrucción que elijas y comprueba si puedes hacer que Gemini te ayude a generar el código.
```
# Count the records in the DataFrame
df.shape # count() will also work
```
2.23 millones de registros probablemente sean más recetas de las que tenemos tiempo para preparar. Es probable que el proceso de indexación en Agent Builder tarde demasiado para nuestro ejercicio de hoy. Como compromiso, tomemos una muestra de 150,000 recetas y trabajemos con eso. Usa tu instrucción > enfoque de código para tomar la muestra y almacenarla en un nuevo DataFrame llamado dfs (s para pequeño).
```
# Sample out 150,000 records into a DataFrame named dfs
dfs = df.sample(n=150000)
```
Nuestros datos de fuente de recetas están listos para cargarse en BigQuery. Antes de realizar la carga, vamos a BigQuery y preparemos un conjunto de datos para contener nuestra tabla. En la consola de Google Cloud, usa el cuadro de búsqueda para navegar a BigQuery. Puedes hacer clic con el botón derecho en BigQuery y abrirlo en una pestaña nueva del navegador.
Si aún no está visible, abre el panel de chat de Gemini AI con el logotipo de Gemini en la parte superior derecha de la consola de Cloud. Si se te solicita que habilites la API de nuevo, presiona Habilitar o actualiza la página. Ejecuta la instrucción: What is a dataset used for in BigQuery? Después de explorar la pregunta de respuesta, How can I create a dataset named recipe_data using the Cloud Console? compara los resultados con los siguientes pasos.
En el panel Explorador de BigQuery, haz clic en el menú de tres puntos Ver acciones junto al ID de tu proyecto. Luego, selecciona Crear conjunto de datos.
Proporciona el conjunto de datos y el ID de recipe_data. Deja el tipo de ubicación en EE.UU. y haz clic en Crear conjunto de datos. Si recibes un error que indica que el conjunto de datos ya existe, simplemente continúa.Con el conjunto de datos creado en BigQuery, volvamos a nuestro notebook y realicemos la inserción.
Regresa a tu notebook de Data Wrangling en Colab Enterprise. En una celda de código nueva, crea una variable llamada project_id y úsala para contener el ID de tu proyecto actual. Busca en la parte superior izquierda de estas instrucciones, debajo del botón Finalizar lab, y encontrarás el ID del proyecto actual. También está en la página principal de la consola de Cloud si lo prefieres. Asigna el valor a tu variable project_id y ejecuta la celda.
```
# Create a variable to hold the current project_id
project_id='YOUR_PROJECT_ID'
```
Usa el enfoque de instrucción > código para crear un bloque de código que inserte el DataFrame dfs en una tabla llamada recipes en el conjunto de datos que acabamos de crear recipe_data. Ejecuta la celda.
```
dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
```

7. Crea una app de búsqueda en Vertex AI Agent Builder para el generador de recetas

Excelente. Ahora que creamos nuestra tabla de datos de recetas, usémosla para crear una fuente de datos sólida para nuestro generador de recetas. El enfoque que usaremos será similar al que usamos para nuestro chatbot de cocina. Usaremos Vertex AI Agent Builder para crear un almacén de datos y, luego, usarlo como fuente de información de una app de búsqueda.

Si lo deseas, puedes pedirle a Gemini en la consola de Google Cloud que te recuerde los pasos para crear una app de búsqueda de Agent Builder, o bien puedes seguir los pasos que se indican a continuación.

Usa la búsqueda para navegar a Agent Builder. Abre Almacenes de datos y Crear almacén de datos. Esta vez, selecciona el tipo de almacén de datos de BigQuery.
En la celda de selección de la tabla, presiona Explorar y busca recipes. Selecciona el botón de selección junto a tu tabla. Si ves recetas de otros proyectos qwiklabs-gcp-…, asegúrate de seleccionar la que te pertenece.NOTA: Si haces clic en recipes en lugar de seleccionar el botón de selección junto a él, se abrirá una pestaña nueva en tu navegador y se te dirigirá a la página de descripción general de la tabla en BigQuery. Solo cierra la pestaña del navegador y selecciona el botón de selección en el compilador de agentes.
Examina, pero no cambies el resto de las opciones predeterminadas y, luego, haz clic en Continuar.
En la página de revisión del esquema, examina las configuraciones predeterminadas iniciales, pero no cambies nada. Continuar
Asigna el nombre recipe-data al almacén de datos. Edita el ID del almacén de datos y configúralo en recipe-data-id. Crea el almacén de datos.
Navega a Apps en el menú de navegación de la izquierda y Crea una app nueva.
Haz clic en Crear en la tarjeta Busca tu sitio web. Asigna el nombre recipe-search a la app y haz clic en EDITAR para establecer el ID como recipe-search-id. Establece el nombre de la empresa como Google y haz clic en Continuar.
Esta vez, revisa las fuentes de datos de recipe-data. Crea la app.

La indexación de nuestra tabla de base de datos llevará un tiempo. Mientras tanto, experimentemos con el nuevo lienzo de datos de BigQuery y veamos si podemos encontrar una o dos recetas interesantes.

Usa el cuadro de búsqueda para navegar a BigQuery. En la parte superior de BigQuery Studio, haz clic en la flecha hacia abajo junto a la pestaña de la derecha y selecciona Lienzo de datos. Establece la región en us-central1.
Haz clic en Buscar datos. En el cuadro de búsqueda del lienzo de datos, busca recipes, presiona Enter/Return para realizar la búsqueda y haz clic en el botón Agregar al lienzo junto al nombre de tu tabla.
Se cargará una representación visual de tu tabla de recetas en el lienzo de datos de BigQuery. Puedes explorar el esquema de la tabla, obtener una vista previa de los datos y examinar otros detalles. Debajo de la representación de la tabla, haz clic en Consulta.
El lienzo cargará un diálogo de consulta de BigQuery más o menos típico con una adición: sobre la ventana de consulta, hay un cuadro de texto que puedes usar para solicitar ayuda a Gemini. Veamos si podemos encontrar algunas recetas de pasteles en nuestro ejemplo. Ejecuta el siguiente mensaje (escribe el texto y presiona Enter/Return para activar la generación de SQL):
```
Please select the title and ingredients for all the recipes with a title that contains the word cake.
```
Observa el SQL generado. Cuando estés conforme, ejecuta la consulta.
No está mal. No dudes en experimentar con algunas otras instrucciones y consultas antes de continuar. Cuando experimentes, prueba indicaciones menos específicas para ver qué funciona y qué no. Por ejemplo, esta instrucción:
```
Do I have any chili recipes?
```
(no olvides ejecutar la nueva consulta). Muestra una lista de recetas de chile, pero no incluye los ingredientes hasta que la modifiqué de la siguiente manera:
```
Do I have any chili recipes?  Please include their title and ingredients.
```
(Sí, digo “por favor” cuando hago una pregunta. Mi mamá estaría muy orgullosa). Noté que una receta de chili contenía hongos, ¿quién quiere eso en el chili? Le pedí a Gemini que me ayudara a excluir esas recetas.
```
Do I have any chili recipes?  Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.
```

8. Abrir el editor de Cloud Shell

Navega al Editor de Cloud Shell.
Si la terminal no aparece en la parte inferior de la pantalla, ábrela:
- Haz clic en el menú de opciones .
- Haz clic en Terminal.
- Haz clic en Terminal nueva.
En la terminal, configura tu proyecto con este comando:
- Formato:
```
gcloud config set project [PROJECT_ID]
```
- Ejemplo:
```
gcloud config set project lab-project-id-example
```
- Si no recuerdas el ID de tu proyecto, haz lo siguiente:
  - Puedes enumerar todos los IDs de tu proyecto con lo siguiente:
```
gcloud projects list | awk '/PROJECT_ID/{print $2}'
```
Si se te solicita autorización, haz clic en Autorizar para continuar.
Deberías ver el siguiente mensaje:
```
Updated property [core/project].
```
Si ves un WARNING y se te pregunta Do you want to continue (Y/N)?, es probable que hayas ingresado el ID del proyecto de forma incorrecta. Presiona N, presiona Enter y vuelve a intentar ejecutar el comando gcloud config set project.

9. Habilita las APIs

En la terminal, habilita las APIs:

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

Si se te solicita autorización, haz clic en Autorizar para continuar. Haz clic para autorizar Cloud Shell

Este comando puede tardar unos minutos en completarse, pero, en algún momento, debería mostrar un mensaje de éxito similar al siguiente:

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

10. Define la aplicación web principal de Python y Streamlit con un poco de ayuda de Gemini

Con la indexación de nuestros dos almacenes de datos de Vertex AI Agent Builder y nuestras apps de búsqueda casi listas para lanzarse, comencemos a compilar nuestra aplicación web.

Aprovecharemos Gemini Code Assist mientras trabajamos. Para obtener más información sobre el uso de Gemini Code Assist en Visual Studio Code, consulta la documentación aquí.

En la terminal del editor de Cloud Shell, ejecuta este comando para clonar el repositorio de la app de recetas.
```
git clone https://github.com/haggman/recipe-app
```
Ejecuta este comando para abrir la carpeta de la aplicación en el editor de Cloud Shell.
```
cloudshell open-workspace recipe-app/
```
Antes de explorar la carpeta clonada y comenzar a trabajar en nuestra aplicación web, debemos acceder a Google Cloud con el complemento Cloud Code del editor y habilitar Gemini. Hagámoslo ahora. En la parte inferior izquierda del editor, haz clic en Cloud Code - Acceder. Si no ves el vínculo, espera un minuto y vuelve a verificarlo.
En la ventana de la terminal, se mostrará una URL larga. Abre la URL en el navegador y sigue los pasos para otorgarle acceso a Cloud Code a tu entorno de Google Cloud. En el diálogo final, Copia el código de verificación y pégalo en la ventana de la terminal en espera en la pestaña del navegador del editor de Cloud Shell.
Después de unos momentos, el vínculo de Cloud Code en la parte inferior izquierda del editor cambiará a Cloud Code - No Project. Haz clic en el nuevo vínculo para seleccionar un proyecto. La paleta de comandos debería abrirse en la parte superior del editor. Haz clic en Seleccionar un proyecto de Google Cloud y selecciona tu proyecto. Después de unos momentos, el vínculo en la parte inferior izquierda del editor se actualizará para mostrar el ID de tu proyecto. Esto indica que Cloud Code se conectó correctamente a tu proyecto en funcionamiento.
Con Cloud Code conectado a tu proyecto, ahora puedes activar Gemini Code Assist. En la parte inferior derecha de la interfaz del editor, haz clic en el logotipo de Gemini tachado. Se abrirá el panel de chat de Gemini a la izquierda del editor. Haz clic en Seleccionar un proyecto de Google Cloud. Cuando se abra la paleta de comandos, selecciona tu proyecto. Si seguiste los pasos correctamente (y Google no cambió nada), ahora deberías ver una ventana de chat de Gemini activa.
Excelente. Con la terminal, el chat de Gemini y la configuración de Cloud Code todo listo, abre la pestaña Explorador y tómate unos minutos para explorar los archivos del proyecto actual.
En el Explorador, abre el archivo requirements.txt para editarlo. Cambia al panel de chat de Gemini y pregunta lo siguiente:
```
From the dependencies specified in the requirements.txt file, what type of application are we building?
```
Por lo tanto, estamos compilando una aplicación web interactiva con Python y Streamlit que interactúa con Vertex AI y Discovery Engine. Genial. Por ahora, enfoquémonos en los componentes de la aplicación web. Como dice Gemini, Streamlit es un framework para compilar aplicaciones web basadas en datos en Python. Ahora pregunta lo siguiente:
```
Does the current project's folder structure seem appropriate for a Streamlit app?
```
Aquí es donde Gemini suele tener problemas. Gemini puede acceder al archivo que tienes abierto en el editor, pero no puede ver todo el proyecto. Prueba preguntar lo siguiente:
```
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
```
¿Tienes una mejor respuesta?
Obtengamos más información sobre Streamlit:
```
What can you tell me about Streamlit?
```
Muy bien. Podemos ver que Gemini nos ofrece una buena descripción general, incluidos los pros y los contras.
Si quieres explorar los inconvenientes, podrías preguntar lo siguiente:
```
What are the major downsides or shortcomings?
```
Ten en cuenta que no tuvimos que decir “de Streamlit” porque Gemini Chat es conversacional (de varios turnos). Gemini sabe de qué hablamos porque estamos en una sesión de chat. Si en algún momento quieres borrar el historial de chat de Gemini, usa el ícono de la papelera que se encuentra en la parte superior de la ventana de chat de código de Gemini.

11. Implementa la aplicación web en Cloud Run

Excelente, tenemos nuestra estructura de aplicación principal, pero ¿funcionará todo? Mejor aún, ¿dónde deberíamos alojarlo en Google Cloud?

En la ventana del chat de Gemini, pregunta lo siguiente:

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

Recuerda que, si aún no estabas trabajando en tu IDE, también puedes usar Google Cloud Assist. Abre la consola de Google Cloud y, luego, Gemini Cloud Assist, y pregunta lo siguiente:
```
If I have a containerized web application, where would be the best place to run it in Google Cloud?
```
¿Los dos conjuntos de consejos fueron los mismos? ¿Estás de acuerdo o en desacuerdo con alguno de los consejos? Recuerda que Gemini es un asistente de IA generativa y, al igual que un asistente humano, no siempre estarás de acuerdo con todo lo que diga. Sin embargo, tener ese asistente siempre a tu lado mientras trabajas en Google Cloud y en tu editor de código puede ayudarte a ser mucho más eficiente.
Para una aplicación web sin estado y de corta duración alojada en contenedores, Cloud Run sería una excelente opción. En la ventana de chat de Gemini de tu editor de código, prueba la siguiente instrucción:
```
What steps would be required to run this application in Cloud Run?
```
Parece que lo primero que debemos hacer es crear un Dockerfile. Con el editor, crea un archivo llamado Dockerfile en la raíz de la carpeta de tu proyecto. Asegúrate de no colocarlo accidentalmente en la carpeta pages. Abre el archivo para editarlo.
Usemos el panel lateral de chat de Gemini para crear nuestro Dockerfile. Usa una instrucción como la siguiente. Cuando los resultados se muestren en el chat, usa el signo + junto al ícono de copia justo encima del Dockerfile sugerido para insertar el código sugerido en el 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 no siempre muestra la misma respuesta a la misma instrucción. La primera vez que le pedí a Gemini un Dockerfile, obtuve el archivo exacto que te sugiero que uses. Acabo de recibir la siguiente sugerencia:
```
# 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"]
```
Es un Dockerfile muy extenso. Lo simplificaría un poco. No necesitamos la sección apt-get, ya que todo lo que se necesita para Python ya está en nuestra imagen base. Además, usar un entorno virtual en un contenedor de Python es un desperdicio de espacio, por lo que lo quitaría. El comando expose no es estrictamente necesario, pero está bien. Además, intenta iniciar main.py, que no tengo.

En la carpeta recipe-app, crea un archivo llamado Dockerfile y pega el siguiente contenido:

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 puede funcionar a través de la ventana de chat, pero también puede funcionar directamente en tu archivo de código con comentarios, como lo hicimos en el notebook de Data Wrangling, y también se puede invocar con Control + I en Windows o Comando + I en Mac. Haz clic en algún lugar de Dockerfile y activa Gemini con el comando Comando + I o Control + I correspondiente.
En la instrucción, ingresa lo siguiente. Examina y acepta el cambio.
```
Please comment the current file.
```
¡Qué genial! ¿Cuántas veces has tenido que trabajar con el código de otra persona y solo has tenido que perder tiempo tratando de comprender su trabajo sin comentarios antes de poder comenzar a hacer tus cambios? ¡Gemini al rescate!
Ahora pregúntale a Gemini cómo podrías usar Cloud Run para compilar e implementar una nueva imagen llamada recipe-web-app desde el Dockerfile en la carpeta actual.
```
How could I use gcloud to build a new Cloud Run service named recipe-web-app from the current directory?
```

Compilemos y, luego, implementemos nuestra aplicación. En la ventana de la terminal, ejecuta el comando gcloud run deploy.

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

Si se te presenta un mensaje que te solicita que crees un repositorio de Artifact Registry, presiona 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)?

Si observas el proceso de compilación, primero se compilará el repositorio de Docker de Artifact Registry. Luego, usa Cloud Build para crear la imagen de contenedor a partir del Dockerfile en la carpeta local. Por último, la imagen de Docker se implementará en un nuevo servicio de Cloud Run. Al final de la secuencia de comandos, obtendrás una URL de prueba de Cloud Run para usar.

Abre el vínculo que se muestra en una pestaña nueva del navegador. Tómate un momento para explorar la estructura y las páginas de la aplicación. Genial. Ahora debemos conectar nuestra funcionalidad de IA generativa.

12. Conecta la página de Cooking Advice a nuestra app de Agent Builder de búsqueda de libros de recetas

Tenemos el framework de la aplicación web en ejecución, pero debemos conectar las dos páginas de trabajo a nuestras dos apps de búsqueda de Vertex AI Agent Builder. Comencemos con Consejos de cocina.

Deja abierta la pestaña del editor de Cloud Shell. En la consola de Google Cloud, usa la búsqueda para navegar a Chat en Vertex AI.
En el panel de la página de configuración de la derecha, establece el modelo en gemini-1.5-flash-002. Desliza el límite de tokens de salida hasta el máximo para que el modelo pueda mostrar respuestas más largas si es necesario. Abre la Configuración del filtro de seguridad. Establece las opciones Incitación al odio o a la violencia, Contenido sexual explícito y Contenido de acoso en Bloquear algunos. Establece el contenido peligroso en Bloquear pocos y Guardar. Colocaremos la categoría Contenido peligroso un poco más abajo porque Gemini puede malinterpretar que hablar de cuchillos y cortes es violencia.
Desliza el botón de activación para habilitar Grounding y, luego, haz clic en Personalizar. Establece la fuente de fundamentación en Vertex AI Search y, para la ruta de acceso del almacén de datos, usa lo siguiente. Cambia YOUR_PROJECT_ID por el ID del proyecto que se encuentra cerca del botón Finalizar lab en estas instrucciones y, luego, Guardar la configuración de puesta a tierra.
```
projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id
```
NOTA: Si recibes un error, significa que no cambiaste el ID del proyecto por el ID real o que te salteaste el paso en el que cambiaste el ID del almacén de datos de Agent Builder de los libros de recetas anteriores. Consulta Agent Builder > Data Stores > old-cookbooks para obtener el ID real del almacén de datos.
Prueba algunos mensajes de chat. Quizás puedas comenzar con lo siguiente. Prueba con otras si quieres.
```
How can I tell if a tomato is ripe?
```
El modelo funciona, ahora experimentemos con el código. Haz clic en Borrar conversación para que nuestras conversaciones no formen parte del código y, luego, en Obtener código.
En la parte superior de la ventana de código, presiona Open Notebook para que podamos experimentar y perfeccionar el código en Colab Enterprise antes de integrarlo en nuestra app.
Tómate unos minutos para familiarizarte con el código. Hagamos algunos cambios para adaptarlo a lo que queremos. Antes de comenzar, ejecuta la primera celda de código para conectarte al procesamiento y, luego, instala el SDK de AI Platform. Después de que se ejecute el bloque, se te pedirá que reinicies la sesión. Adelante, hazlo.
Ve al código que extrajimos de Vertex AI Studio. Cambia el nombre del método multiturn_generate_content a start_chat_session.
Desplázate hasta la llamada al método model = GenerativeModel(. El código existente define generation_config y safety_settings, pero en realidad no los usa. Modifica la creación de GenerativeModel para que se parezca a lo siguiente:
```
model = GenerativeModel(
    "gemini-1.5-flash-002",
    tools=tools,
    generation_config=generation_config,
    safety_settings=safety_settings,
)
```

Por último, agrega una línea final al método, justo debajo de chat = model.start_chat(), para que la función muestre el objeto chat. La función terminada debería verse como la siguiente.NOTA: NO COPIES este código en tu notebook. Solo está aquí como una verificación de estado.

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

Desplázate hasta la parte inferior de la celda de código y cambia la línea final que llama a la función anterior para que llame al nombre de la función nueva y almacene el objeto que se muestra en una variable chat. Una vez que estés conforme con los cambios, ejecuta la celda.
```
chat = start_chat_session()
```
Crea una celda de código nueva y agrega el comentario # Use chat to invoke Gemini and print out the response. Ve a la siguiente línea y escribe resp. Gemini debería completar automáticamente el bloque por ti. Actualiza la instrucción a How can I tell if a tomato is ripe?. Ejecuta la celda
```
response = chat.send_message("How can I tell if a tomato is ripe?")
print(response)
```
Esa es la respuesta correcta, pero la parte que realmente queremos es ese campo text anidado. Modifica el bloque de código para que imprima solo esa sección, como:
```
response = chat.send_message("How can I tell if a tomato is ripe?")
print(response.candidates[0].content.parts[0].text)
```
Muy bien. Ahora que tenemos un código de chat que funciona, vamos a integrarlo en nuestra aplicación web. Copia todo el contenido de la celda de código que crea la función start_chat_session (no necesitaremos la celda de prueba). Si haces clic en la celda, puedes hacer clic en el menú de tres puntos en la esquina superior derecha y copiar desde allí.
Cambia a la pestaña del editor de Cloud Shell y abre pages\Cooking_Advice.py para editarlo.

Ubica el comentario:

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

Pega el código copiado debajo del comentario Agrega el código. Genial. Ahora tenemos la sección que controla el motor de chat a través de una llamada a tierra a Gemini. Ahora, integrémoslo en Streamlit.

Busca la sección de código comentado directamente debajo del comentario:

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

Quita el comentario de esta sección de código (hasta la siguiente sección Setup done, let's build the page UI) y explórala. Crea o recupera las variables de sesión de chat y de historial.
A continuación, debemos integrar la funcionalidad de historial y chat en la IU. Desplázate por el código hasta encontrar el siguiente comentario.
```
#
# Here's the code to create the chat interface
# Uncomment the below code when instructed
#
```
Quita el comentario del resto del código debajo del comentario y tómate un momento para explorarlo. Si quieres, puedes destacarlo y pedirle a Gemini que te explique su funcionalidad.
Excelente. Ahora, compilemos la aplicación y, luego, implementemos. Cuando vuelva a aparecer la URL, inicia la aplicación y prueba la página de Cooking Advisor. Quizás quieras preguntarle sobre tomates maduros o si el bot conoce una buena forma de preparar coles de Bruselas.
```
gcloud run deploy recipe-web-app \
    --allow-unauthenticated \
    --source=. \
    --region=us-central1 \
    --port=8501
```

Es perfecto, ¿verdad? Tu propio asesor de cocina personal con IA :-)

13. (Opcional) Conecta la página de búsqueda de recetas a la app de Agent Builder de búsqueda de recetas

Cuando conectamos la página de Cooking Advice a su fuente de origen, lo hicimos directamente con la API de Gemini. Para la búsqueda de recetas, conéctate directamente a la app de búsqueda de Vertex AI Agent Builder.

En el editor de Cloud Shell, abre la página pages/Recipe_Search.py para editarla. Investiga la estructura de la página.
En la parte superior del archivo, establece el ID de tu proyecto.
Examina la función search_sample. Este código proviene más o menos directamente de la documentación de Discovery Engine aquí. Puedes encontrar una copia de trabajo en este notebook aquí.El único cambio que hice fue mostrar el response.results en lugar de solo los resultados. Sin esto, el tipo devuelto es un objeto diseñado para paginar los resultados, y eso es algo que no necesitamos para nuestra aplicación básica.
Desplázate hasta el final del archivo y quita el comentario de toda la sección debajo de Here are the first 5 recipes I found.
Destaca toda la sección de la que quitaste el comentario y abre el chat de Gemini Code. Pregunta, Explain the highlighted code. Si no tienes nada seleccionado, Gemini puede explicar todo el archivo. Si destacas una sección y le pides a Gemini que la explique, comente o mejore, lo hará.Tómate un momento y lee la explicación. Por lo que vale, usar un notebook de Colab Enterprise es una excelente manera de explorar las APIs de Gemini antes de integrarlas en tu aplicación. Es especialmente útil para explorar algunas de las APIs más nuevas que pueden no estar documentadas tan bien como podrían.
En la ventana de la terminal del editor, ejecuta build.sh para implementar la aplicación final. Espera a que se implemente la nueva versión antes de continuar con el siguiente paso.

14. Explora la aplicación final (opcional)

Tómate unos minutos para explorar la aplicación final.

En la consola de Google Cloud, usa la búsqueda para navegar a Cloud Run y, luego, haz clic en recipe-web-app.
Busca la URL de prueba de la aplicación (hacia la parte superior) y ábrela en una pestaña nueva del navegador.
Debería aparecer la página principal de la aplicación. Observa el diseño y la navegación básicos que proporciona Streamlit, con los archivos de Python de la carpeta pages que se muestran como opciones de navegación y el Home.py cargado como la página principal. Navega a la página Sugerencias de cocción.
Después de unos momentos, aparecerá la interfaz de chat. Una vez más, observa el excelente diseño principal que proporciona Streamlit.

Prueba algunas preguntas relacionadas con la cocina y observa cómo funciona el bot. Algo como lo siguiente:

Do you have any advice for preparing broccoli?

How about a classic chicken soup recipe?

Tell me about meringue.

Ahora, busquemos una o dos recetas. Navega a la página de búsqueda de recetas y prueba algunas búsquedas. Algo como lo siguiente:
```
Chili con carne

Chili, corn, rice

Lemon Meringue Pie

A dessert containing strawberries
```

15. ¡Felicitaciones!

Creaste una aplicación que aprovecha las aplicaciones de Vertex AI Agent Builder. A lo largo del camino, exploraste Gemini Cloud Assist, Gemini Code Assist y las funciones de lenguaje natural a SQL del lienzo de datos de BigQuery. ¡Gran trabajo!

Limpia

Cloud SQL no tiene un nivel gratuito y se te cobrará si continúas usándolo. Puedes borrar tu proyecto de Cloud para evitar que se generen cargos adicionales.

Si bien Cloud Run no cobra cuando el servicio no se usa, es posible que se te cobre por el almacenamiento de la imagen del contenedor en Artifact Registry. Si borras tu proyecto de Cloud, se detendrá la facturación de todos los recursos que usaste en ese proyecto.

Si lo deseas, borra el proyecto:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

También te recomendamos que borres los recursos innecesarios del disco de CloudShell. Puedes hacer lo siguiente:

Borra el directorio del proyecto del codelab:
```
rm -rf ~/task-app
```
Advertencia. No podrás deshacer esta acción. Si quieres borrar todo en Cloud Shell para liberar espacio, puedes borrar todo el directorio principal. Asegúrate de que todo lo que quieras conservar esté guardado en otro lugar.
```
sudo rm -rf $HOME
```