1. Descripción general
En este lab, usarás los productos de IA generativa de Google para compilar infraestructura en Google Cloud con la ayuda de Gemini Cloud Assist, consultar datos de BigQuery con las funciones de lenguaje natural a 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, por último, integrar funciones de búsqueda y chat basadas en IA que se compilan en fuentes de fundamentación de Cloud Storage y 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 fundamentada de Vertex AI Agent Builder vinculada a un grupo de libros de cocina. Ofrecerá consejos de cocina y responderá preguntas relacionadas con la cocina. La Búsqueda de recetas será un motor de búsqueda alimentado por Gemini, esta vez basado en una base de datos de recetas de BigQuery.
Si te quedas atascado en algún código 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 asesoramiento sobre 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
- Estructura 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 sugerencias de cocina a nuestra app de Agent Builder de búsqueda de libros de cocina
- Opcional: Conecta la página de Búsqueda de recetas a la app de Agent Builder de búsqueda de recetas
- (Opcional) Explora la aplicación final
2. Configuración y requisitos
Antes de hacer clic en el botón Comenzar lab
Lee estas instrucciones. Los labs son cronometrados y no se pueden pausar. El cronómetro, que comienza a funcionar cuando haces clic en Comenzar lab, indica por cuánto tiempo tendrás a tu disposición los recursos de Google Cloud.
En este lab práctico de Qwiklabs, se te proporcionarán credenciales temporales nuevas para acceder a Google Cloud y realizar las actividades en un entorno de nube real, no en uno de simulación o demostración.
Requisitos
Para completar este lab, necesitarás lo siguiente:
- Acceso a un navegador de Internet estándar (se recomienda el navegador Chrome)
- Tiempo para completar el lab
Nota: Si ya tiene un proyecto o una cuenta personal de Google Cloud, no los use para este lab.
Nota: Si utilizas una Pixelbook, abre una ventana de incógnito para ejecutar este lab.
Cómo iniciar su lab y acceder a la consola de Google Cloud
- Haz clic en el botón Comenzar lab. Si debes pagar por el lab, se abrirá una ventana emergente para que selecciones tu forma de pago. A la izquierda, verás un panel con las credenciales temporales que debes usar para este lab.
- Copia el nombre de usuario y, luego, haz clic en Abrir Google Console. El lab inicia recursos y abre otra pestaña en la que se muestra la página de acceso.
Sugerencia: Abra las pestañas en ventanas separadas, una junto a la otra.
Si ves la página Elige una cuenta (Choose an account), haz clic en Usar otra cuenta (Use another account).
- En la página Acceder, pega el nombre de usuario que copiaste del panel Detalles de la conexión. Luego, copia y pega la contraseña.
Importante: Debe usar las credenciales del panel Detalles de conexión. No use sus credenciales de Qwiklabs. Si tiene una cuenta propia de Google Cloud, no la utilice para este lab a fin de no incurrir en cargos. 4. Haz clic para avanzar por las páginas siguientes:
- Acepta los términos y condiciones.
- No agregues opciones de recuperación ni autenticación de dos factores (esta es una cuenta temporal).
- No se registre para obtener pruebas gratuitas.
Después de un momento, se abrirá la consola de Cloud en esta pestaña.
Nota: Para ver el menú con una lista de los productos y servicios de Google Cloud, haz clic en el menú de navegación que se encuentra en la parte superior izquierda de la pantalla.
3. Tarea 0: Verifica tu clúster de estación de trabajo
En una parte posterior de este lab, usarás una estación de trabajo de Google Cloud para realizar tareas de desarrollo. El proceso de inicio de este lab debería haber comenzado la creación del clúster de tu estación de trabajo. Antes de continuar, asegúrate de que el clúster se esté compilando.
- En la consola de Google Cloud, usa el cuadro de búsqueda para navegar a Cloud Workstations.
- Usa el menú de navegación de la izquierda para ver Administración de clústeres.
- Si tienes un clúster en estado Updating, puedes continuar con la tarea 1. Si no ves ningún clúster en ningún estado, actualiza la página. Si aún no ves un clúster en actualización (compilación), finaliza el lab con el botón que se encuentra en la parte superior izquierda de estas instrucciones y reinícialo.
4. Tarea 1: 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 sugerencias, ayudarte a compilar, configurar y supervisar tu infraestructura de Google Cloud, y hasta sugerirte comandos de gcloud y escribir secuencias de comandos de Terraform.
- Para activar Cloud Assist, haz clic en el cuadro de búsqueda que se encuentra en la parte superior de la IU de Cloud Console y selecciona Pregúntale a Gemini (o la redacción podría ser Pregúntale a Gemini en la consola de Cloud).
- Desplázate hasta la sección API requerida de la página y habilita la API de Gemini para Google Cloud.
- Si no ves de inmediato una interfaz de chat, haz clic en Empezar a chatear. Comienza por pedirle a Gemini que explique algunos de los beneficios de usar Cloud Workstations. 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 en 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?
- Ahora, en tu ventana que no es de incógnito, ve al sitio web público de Gemini aquí, accede si es necesario y haz la misma pregunta. ¿Las respuestas son iguales o, al menos, similares? ¿Cuáles son los pasos específicos? ¿Alguna es notablemente mejor? De todos modos, ten en cuenta las respuestas a medida que avancemos en los próximos pasos.
Nota: Si intentas realizar el paso anterior con tu cuenta temporal de Qwiklabs, se bloqueará. Si tu cuenta laboral también está bloqueada porque tu organización no permite el uso de la app web de Gemini, simplemente omite el paso y continúa. Esto no afectará tu capacidad para completar este ejercicio.
5. Tarea 2: Crea una app de búsqueda en Vertex AI Agent Builder para el chatbot de asesoramiento sobre cocina
El sitio web que estamos creando tendrá una página de consejos de cocina que contendrá un chatbot diseñado para ayudar a los usuarios a encontrar respuestas a preguntas relacionadas con la cocina. Se potenciará con Gemini fundamentado en una fuente que contiene 70 libros de cocina de dominio público. Los libros de cocina actuarán como la fuente de verdad que Gemini usa cuando responde 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. Si aparece un cuadro emergente sobre la necesidad de habilitar la API de Vertex AI, haz clic en Habilitar.
- Usa la búsqueda para navegar a Agent Builder y, luego, haz clic en Continuar y activar la API.
- Como sugirió Gemini en nuestra consulta anterior, crear una app de búsqueda en Agent Builder comienza con la creación de una fuente de datos autorizada. Cuando el usuario realiza una búsqueda, Gemini comprende la pregunta y cómo componer respuestas inteligentes, pero buscará la fuente fundamentada para obtener la información que se usa en esa respuesta, en lugar de recurrir a su conocimiento innato.
En el menú de la izquierda, navega a Almacenes de datos y Crear almacén de datos. 4. 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. 5. Examina, pero no cambies las opciones predeterminadas relacionadas con el tipo de información que importamos. Deja el tipo de importación establecido en Folder y, para la ruta de acceso al bucket, usa labs.roitraining.com/labs/old-cookbooks y, luego, haz clic en Continuar. 6. Asigna el nombre old-cookbooks al almacén de datos. Edita 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 verdad para cada una de ellas. Las apps de búsqueda son útiles para el uso general y la búsqueda. Las apps de chat son para flujos generativos en aplicaciones de chatbot o voicebot basadas en Dataflow. Las apps de recomendaciones ayudan a crear mejores motores de recomendaciones. Además, las apps de agentes se usan para crear agentes basados en IA generativa. Con el tiempo, es probable que Agent sea la mejor opción para lo que queremos hacer, pero, como el producto se encuentra en versión preliminar, seguiremos usando el tipo de app de Search. 7. Usa el menú de la izquierda para navegar a Apps y, luego, haz clic en Create App. 8. Selecciona el tipo de app de Búsqueda. Examina las distintas opciones, pero no las cambies. Asigna un nombre a la app: cookbook-search. Edita y establece el ID de la app en cookbook-search-id. Establece la empresa en Google y haz clic en Continuar. 9. Verifica 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 las recetas aún se están importando y se están indexando. El Agent Builder tardará más de 5 minutos en indexar las miles de páginas que contienen los 70 libros de cocina que le proporcionamos. Mientras funciona, carguemos y limpiemos algunos datos de la base de datos de recetas para nuestro generador de recetas.
6. Tarea 3: 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 conozcan 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 se integra por completo con el resto de los productos de 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. Code Assist se puede usar en varios editores de código diferentes y puede ofrecer consejos, así como sugerencias intercaladas fluidas mientras escribes código. Aprovecharemos este asistente generativo mientras organizamos los datos de nuestras recetas.
- Usa la búsqueda para navegar a Colab Enterprise y Crear un notebook. Si recibes una oferta para experimentar con nuevas funciones de Colab, descártala. Para que el tiempo de ejecución, la potencia de procesamiento detrás del notebook, se ponga en marcha, presiona Conectar en la esquina superior derecha de tu notebook nuevo.
- Usa el menú de tres puntos junto al nombre del notebook actual en el panel Archivos de Colab Enterprise para cambiarle el nombre
Data Wrangling.
- Crea 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 que se encuentra debajo del bloque de texto que acabas de crear, comienza a escribir imp. 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. Nuevamente, comienza a escribir df y examina el código generado por Gemini Code Assist. 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ú Comandos o el teclado para ejecutar la celda seleccionada. En el teclado, Mayúsculas + Intro ejecutará la celda y cambiará el enfoque a la siguiente, creando una si es necesario. Espera a que se ejecute la celda antes de continuar.
Nota: Verás [ ] justo a la izquierda cuando no se haya ejecutado una celda. Mientras se ejecuta una celda, verás una animación giratoria que indica que está en funcionamiento. Una vez que finalice la celda, aparecerá un número, como [13]. 9. 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 que, finalmente, usaremos para fundamentar nuestro generador de recetas. 10. Crea un bloque de código nuevo y escribe el siguiente comentario. Después de escribir el comentario, muévete a la siguiente línea de código y deberías recibir la sugerencia df.columns. Luego, acepta y ejecuta la celda.
# 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 las 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 Gemini Code Assist de Google.
- Limpiemos un poco las columnas. Cambia el nombre de la columna
Unnamed: 0aidy el delinkauri. Usa las técnicas de instrucciones y código que prefieras 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
sourceyNER, y usahead()para ver las primeras filas. Nuevamente, pídele ayuda a Gemini. Ejecuta las dos últimas 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 ve si puedes lograr 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 son probablemente más recetas de las que tenemos tiempo para ver. El proceso de indexación en Agent Builder probablemente tardaría demasiado para el ejercicio de hoy. Como solución intermedia, tomemos una muestra de 150,000 recetas y trabajemos con ella. Usa tu enfoque de instrucción > código para tomar la muestra y almacenarla en un DataFrame nuevo llamado
dfs(s de pequeño).
# Sample out 150,000 records into a DataFrame named dfs
dfs = df.sample(n=150000)
- Los datos de origen de nuestras recetas están listos para cargarse en BigQuery. Antes de realizar la carga, dirijámonos 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 nueva pestaña 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 vuelvas a habilitar la API, presiona Habilitar o actualiza la página. Ejecuta la instrucción:
What is a dataset used for in BigQuery?Después de explorar la respuesta, pregunta: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.
- Asigna 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. 19. Vuelve 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 almacenar el ID de tu proyecto actual. En la parte superior izquierda de estas instrucciones, debajo del botón Finalizar lab, encontrarás el ID del proyecto actual. También puedes encontrarlo en la página principal de la consola de Cloud. 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
dfsen una tabla llamadarecipesen el conjunto de datos que acabamos de crearrecipe_data. Ejecuta la celda.
dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
7. Tarea 4: 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 compilar una fuente de datos fundamentada 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, lo usaremos como fuente de verdad para 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 Examinar 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 opció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 Agent Builder. 3. Examina el resto de las opciones predeterminadas, pero no las cambies y, luego, haz clic en Continuar. 4. En la página de revisión del esquema, examina las configuraciones predeterminadas iniciales, pero no cambies nada. Continuar 5. Asigna el nombre recipe-data al almacén de datos. Edita el ID del almacén de datos y configúralo como recipe-data-id. Crea el almacén de datos. 6. Navega a Apps usando el menú de navegación de la izquierda y Create App. 7. Vuelve a seleccionar la app de Búsqueda. Nombra la app recipe-search y establece el ID en recipe-search-id. Establece el nombre de la empresa como Google y haz clic en Continuar. 8. Esta vez, verifica las fuentes de datos de recipe-data. Crea la app.
La indexación de nuestra tabla de base de datos tardará un tiempo. Mientras tanto, experimentemos con el nuevo lienzo de datos de BigQuery y veamos si podemos encontrar una o dos recetas interesantes. 9. Usa el cuadro de búsqueda para navegar a BigQuery. En la parte superior de BigQuery Studio, haz clic en la flecha hacia abajo que se encuentra junto a la pestaña más a la derecha y selecciona Lienzo de datos. Establece la región en us-central1.
- En el cuadro de búsqueda del lienzo de datos, busca
recipesy agrega tu tabla al lienzo. - 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 pedirle ayuda a Gemini. Veamos si podemos encontrar algunas recetas de tortas en nuestra muestra. Ejecuta la siguiente instrucción (escribe el texto y presiona Intro o Retorno 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 código SQL generado. Cuando estés conforme, ejecuta la consulta.
- ¡Nada mal! Si lo deseas, puedes experimentar con algunas otras instrucciones y consultas antes de continuar. Cuando experimentes, prueba instrucciones 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 búsqueda). Se devolvió una lista de recetas de chili, pero se omitieron 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 doy instrucciones. Mi mamá estaría muy orgullosa).
Noté que una receta de chili contenía champiñones, y ¿quién querría 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. Tarea 5: Estructura la aplicación web principal de Python y Streamlit con un poco de ayuda de Gemini
Ahora que nuestros dos almacenes de datos de Vertex AI Agent Builder están indexados y nuestras apps de búsqueda están casi listas para lanzarse, comencemos a crear nuestra aplicación web.
Aprovecharemos Gemini Code Assist mientras trabajamos. Para obtener más información sobre cómo usar Gemini Code Assist en Visual Studio Code, consulta la documentación aquí.
Realizaremos nuestro desarrollo en una estación de trabajo de Google Cloud, un entorno de desarrollo basado en la nube que, en nuestro caso, ya tiene cargado Eclipse Theia (Visual Studio Code de código abierto). En este ejercicio, una secuencia de comandos automatizada creó el clúster y la configuración de Cloud Workstation por nosotros, pero aún debemos crear la Cloud Workstation. Si deseas obtener más información sobre Cloud Workstations y su uso, puedes preguntarle a Gemini Cloud Assist :-)
- Usa la búsqueda para navegar a Cloud Workstations y, luego, a Crear estación de trabajo. Asigna el nombre
dev-enva la estación de trabajo y usa la configuración my-config. Crea la estación de trabajo. - Después de unos minutos, verás tu nueva estación de trabajo en la lista Mis estaciones de trabajo. Inicia
dev-envy, una vez que se esté ejecutando, lanza el entorno de desarrollo. - El editor de estaciones de trabajo se abrirá en una nueva pestaña del navegador y, después de unos momentos, deberías ver una interfaz familiar de Theia (Visual Studio Code). En el lado izquierdo de la interfaz, expande la pestaña Control de código fuente y presiona Clonar repositorio.
- En la URL del repositorio, ingresa
https://github.com/haggman/recipe-app. Clona el repo en tu carpetausery, luego, ábrelo para editarlo. - Antes de explorar la carpeta clonada y comenzar a trabajar en nuestra aplicación web, debemos hacer que el complemento de Cloud Code del editor acceda a Google Cloud 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 verificar.
- En la ventana de la terminal, se mostrará una URL larga. Abre la URL en el navegador y sigue los pasos para otorgar acceso a Cloud Code a tu entorno de Google Cloud. Cuando te autentiques, asegúrate de usar tu cuenta temporal de ejercicio
student-...y no tu cuenta personal de Google Cloud. En el diálogo final, copia el código de verificación y pégalo en la ventana de terminal en espera en la pestaña del navegador de tu estación de trabajo de Cloud. - Después de unos momentos, el vínculo de Cloud Code que se encuentra en la parte inferior izquierda del editor cambiará a Cloud Code - No Project. Haz clic en el vínculo nuevo 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 elige tu proyecto qwiklabs-gcp-.... 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 adjuntó correctamente a tu proyecto de trabajo.
- 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. El panel de Gemini Chat se abrirá a la izquierda del editor. Haz clic en Seleccionar un proyecto de Google Cloud. Cuando se abra la paleta de comandos, selecciona tu proyecto qwiklabs-gcp-.... Si seguiste los pasos correctamente (y Google no cambió nada), deberías ver una ventana de chat de Gemini activa.
- Por último, configuremos la ventana de terminal del editor de la misma manera. Usa menú de hamburguesa > View > Terminal para abrir la ventana de la terminal. Ejecuta
gcloud init. Una vez más, usa el vínculo para permitir que la terminal de Cloud Shell funcione con tu proyecto deqwiklabs-gcp-.... Cuando se te solicite, selecciona la opción numérica de tu proyecto deqwiklabs-gcp-.... - Excelente. Con la terminal, el chat de Gemini y las configuraciones de Cloud Code listos, abre la pestaña Explorer y tómate unos minutos para explorar los archivos del proyecto actual.
- En el Explorador, abre el archivo
requirements.txtpara 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 creando una aplicación web interactiva con Python y Streamlit que interactúa con Vertex AI y Discovery Engine. Por ahora, enfoquémonos en los componentes de la aplicación web. Como dice Gemini, Streamlit es un framework para crear aplicaciones web basadas en datos en Python. Ahora pídele lo siguiente:
Does the current project's folder structure seem appropriate for a Streamlit app?s
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 con la siguiente instrucción:
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
¿Obtuviste una mejor respuesta?
- Obtén más información sobre Streamlit:
What can you tell me about Streamlit?
Bien, podemos ver que Gemini nos ofrece una buena descripción general que incluye ventajas y desventajas.
- Si quisieras explorar las desventajas, 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é hemos estado hablando 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 papelera que se encuentra en la parte superior de la ventana de chat de código de Gemini.
9. Tarea 6: Implementa la aplicación web en Cloud Run
Excelente. Ya tenemos la estructura principal de la aplicación, pero ¿funcionará todo? Mejor aún, ¿dónde deberíamos alojarlo en Google Cloud?
- En la ventana del chat de Gemini, haz la siguiente pregunta:
If I containerize this application, what compute technologies
in Google Cloud would be best for hosting it?
- Recuerda que, si no estabas trabajando en tu IDE, también podrías usar Google Cloud Assist. Abre la consola de Google Cloud, luego, Gemini Cloud Assist y haz la siguiente pregunta:
If I have a containerized web application, where would be the
best place to run it in Google Cloud?
¿Los dos conjuntos de consejos eran 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 con un asistente humano, no siempre estarás de acuerdo con todo lo que diga. Aun así, tener ese asistente siempre a tu lado mientras trabajas en Google Cloud y en tu editor de código puede hacerte mucho más eficiente.
- Para una aplicación web alojada en contenedores sin estado y de corta duración, Cloud Run sería una excelente opción. En la ventana de chat de Gemini del 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
Dockerfileen la raíz de la carpeta de tu proyecto. Asegúrate de no colocarlo accidentalmente en la carpeta de páginas. Abre el archivo para editarlo. - Usemos el panel lateral de chat de Gemini para crear nuestro
Dockerfile. Usa una instrucción como la que se muestra a continuación. Cuando los resultados se muestren en el chat, usa el signo + que se encuentra junto al ícono de copiar, justo arriba 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 devuelve la misma respuesta a la misma instrucción. La primera vez que le pedí a Gemini un Dockerfile, obtuve el archivo exacto que te sugeriré que uses. Acabo de recibir la siguiente sugerencia:
```docker
# 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"]
That's a heck of a Dockerfile. I'd simplify it a bit. We don't need the apt-get section as anything needed for Python is already in our base image. Also, using a virtual environment in a Python container is a waste of space, so I'd remove that. The expose command isn't strictly necessary, but it's fine. Also, it's trying to start main.py which I don't have.
6. Tweak the Dockerfile so it resembles the following:
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"]
7. We need a place in Google cloud where we can store our container image. Let's get a little help from Gemini. In the Google Cloud Console Gemini Cloud Assist ask:
¿Cuál es el mejor lugar en Google Cloud para almacenar imágenes de Docker?
8. If one of the answers you received is the Google Container Registry, then I guess Gemini hasn't gotten word that GCR is deprecated. Again, just like human assistants, you may get out of date or simply wrong answers (hallucinations). Always make sure to consider your choices carefully, even when Gemini is recommending something.
Let's go with Artifact Registry. Ask Gemini Cloud Assist how to create a docker registry in Artifact Registry named cooking-images.
¿Cómo puedo usar gcloud para crear un registro de Docker en Artifact Registry?
9. Now ask Gemini how you could use Cloud Build to build a new image named `recipe-web-app` from the Dockerfile in the current folder.
¿Cómo puedo usar gcloud para compilar un nuevo servicio de Cloud Run llamado recipe-web-app a partir de una imagen con el mismo nombre del repositorio de Artifact Registry que acabamos de crear?
10. To save you a little time, I've created a script that will create the Artifact Registry repo (if needed), use Cloud Build to build and push the image to the repo, and finally to deploy the application to Cloud Run. In your code editor use the **Explorer** view to open `build.sh` and explore the file.
11. Gemini can operate via the chat window, but it can also work directly in your code file using comments, like we used in the Data Wrangling notebook, and it also may be invoked using Control+i on Windows or Command+i on Mac. Click somewhere in the build.sh script file, activate Gemini using the appropriate Command+i / Control+i command.
<img src="img/61ac2c9a245a3695.png" alt="61ac2c9a245a3695.png" width="624.00" />
12. At the prompt enter the below. Examine and **Accept** the change.
Comenta el archivo actual.
How cool is that?! How many times have you had to work with someone elses code, only to have to waste time gaining a base understanding of their commentless work before you can even start making your changes. Gemini to the rescue!
13. Let's build and deploy our application. In the terminal window execute the `build.sh` file.
. build.sh
14. If you watch the build process, first it will build the Artifact Registry docker repo. Then, it uses Cloud Build to create the container image from the Dockerfile in the local folder (since we didn't supply a `cloudbuild.yaml`). Lastly, the docker image will be deployed into a new Cloud Run service. At the end of the script you'll get a Cloud Run test URL to use.
Open the returned link in a new tab of your browser. Take a moment and explore the application's structure and pages. Nice, now we need a hook in our generative AI functionality.
## Task 7: Connect the Cooking Advice page to our cookbook-search Agent Builder app
We have the framework for the web application running, but we need to connect the two work pages to our two Vertex AI Agent Builder search apps. Let's start with Cooking Advice.
1. In the Google Cloud console use search to navigate to **Chat** in Vertex AI.
2. In the right hand settings page pane set the model to **gemini-1.5-flash-002**. Slide the output token limit up to the max so the model can return longer answers if needed. Open the **Safety Filter Settings**. Set Hate speech, Sexually explicit content, and Harassment content to **Block some**. Set Dangerous content to **Block few** and **Save**. We're setting Dangerous Content a bit lower because talking about knives and cutting can be misinterpreted by Gemini as violence.
3. Slide on the toggle to enable **Grounding** then click **Customize**. Set the grounding source to **Vertex AI search** and for the datastore path use the following. Change YOUR_PROJECT_ID to the project ID found up near the End Lab button in these instructions, then **Save** the grounding settings
projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id
**Note:** If you get an error then you either didn't change the project ID to your actual project ID, or you may have missed the step where you changed the old-cookbooks Agent Builder Data Store ID. Check your Agent Builder > Data Stores > old-cookbooks for its actual Data store ID.
4. Test a couple of chat messages. Perhaps start with the below. Try a few others if you like.
¿Cómo puedo saber si un tomate está maduro?
5. The model works, now let's experiment with the code. Click **Clear Conversation** so our conversations don't become part of the code then click **Get Code**.
<img src="img/dce8ad7ee006cca1.png" alt="dce8ad7ee006cca1.png" width="624.00" />
6. At the top of the code window, press Open Notebook so we can experiment and perfect the code in Colab Enterprise before integrating it into our app.
7. Take a few minutes to familiarize yourself with the code. Let's make a couple of changes to adapt it to what we want. Before we start, run the first code cell to connect to the compute and install the AI Platform SDK. After the block runs you will be prompted to restart the session. Go ahead and do that.
8. Move to the code we pulled out of Vertex AI Studio. Change the name of the method *multiturn_generate_content* to `start_chat_session`.
9. Scroll to the `model = GenerativeModel(` method call. The existing code defines the `generation_config` and `safety_settings` but doesn't actually use them. Modify the creation of the `GenerativeModel` so it resembles:
model = GenerativeModel( "gemini-1.5-flash-002", tools=tools, generation_config=generation_config, safety_settings=safety_settings, )
10. Lastly, add a final line to the method, just below `chat = model.start_chat()`, so the function returns the `chat` object. The finished function should look like the below.
**Note:** DO NOT COPY this code into your notebook. It is simply here as a sanity check.
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
11. Scroll to the bottom of the code cell and change the final line calling the old function so it calls the new function name and stores the returned object in a variable `chat`. Once you are satisfied with your changes, run the cell.
chat = start_chat_session()
12. Create a new code cell and add the comment `# Use chat to invoke Gemini and print out the response`. Move to the next line and type resp and Gemini should auto complete the block for you. Update the prompt to `How can I tell if a tomato is ripe?`. Run the cell
response = chat.send_message("How can I tell if a tomato is ripe?") print(response)
13. That's the response alright, but the part we really want is that nested text field. Modify the codeblock to print just that section, like:
response = chat.send_message("How can I tell if a tomato is ripe?") print(response.candidates[0].content.parts[0].text)
14. Good, now that we have working chat code, let's integrate it into our web application. Copy all the contents of the code cell that creates the `start_chat_session` function (we won't need the test cell). If you click into the cell you can click the triple dot menu in the upper right corner and copy from there
<img src="img/17bf8d947393d4b.png" alt="17bf8d947393d4b.png" width="326.00" />
15. Switch to your Cloud Workstation editor and open pages\Cooking_Advice.py for editing.
16. Locate the comment:
Agrega el código que copiaste de tu notebook debajo de este mensaje.
17. Paste your copied code just below the above comment. Nice, now we have the section which drives the chat engine via a grounded call to Gemini. Now let's integrate it into Streamlit.
18. Locate section of commented code directly below the comment:
Este es el código para configurar tus variables de sesión
Quita el comentario de este bloque cuando se te indique.
19. Uncomment this section of code (Up till the next `Setup done, let's build the page UI` section) and explore it. It creates or retrieves the chat and history session variables.
20. Next, we need to integrate the history and chat functionality into the UI. Scroll in the code until you locate the below comment.
Este es el código para crear la interfaz de chat
Quita el comentario del siguiente código cuando se te indique.
21. Uncomment the rest of the code below the comment and take a moment to explore it. If you like, highlight it and get Gemini to explain its functionality.
22. Excellent, now let's build the application and deploy it. When the URL comes back, launch the application and give the Cooking Advisor page a try. Perhaps ask it about ripe tomatoes, or the bot knows a good way to prepare brussels sprouts.
. build.sh
How cool is that! Your own personal AI cooking advisor :-)
## Task 8: (Optional) Connect the Recipe Search page to the recipe-search Agent Builder app
When we connected the Cooking Advice page to its grounded source, we did so using the Gemini API directly. For Recipe Search, let's connect to the Vertex AI Agent Builder search app directly.
1. In your Cloud Workstation editor, open the `pages/Recipe_Search.py` page for editing. Investigate the structure of the page.
2. Towards the top of the file, set your project ID.
3. Examine the `search_sample` function. This code more or less comes directly from the Discovery Engine documentation [here](https://cloud.google.com/generative-ai-app-builder/docs/preview-search-results#genappbuilder_search-python). You can find a working copy in this notebook [here](https://github.com/GoogleCloudPlatform/generative-ai/blob/main/search/create_datastore_and_search.ipynb).
4. The only change I made was to return the `response.results` instead of just the results. Without this, the return type is an object designed to page through results, and that's something we don't need for our basic application.
5. Scroll to the very end of the file and uncomment the entire section below `Here are the first 5 recipes I found`.
6. Highlight the whole section you just uncommented and open Gemini Code chat. Ask, `Explain the highlighted code`. If you don't have something selected, Gemini can explain the whole file. If you highlight a section and ask Gemini to explain, or comment, or improve it, Gemini will.
Take a moment and read through the explanation. For what it's worth, using a Colab Enterprise notebook is a great way to explore the Gemini APIs before you integrate them into your application. It's especially helpful at exploring some of the newer APIs which may not be documented as well as they could be.
7. At your editor terminal window, run `build.sh` to deploy the final application. Wait until the new version is deployed before moving to the next step.
## Task 9: (Optional) Explore the final application
Take a few minutes to explore the final application.
1. In the Google Cloud console, use search to navigate to **Cloud Run**, then click into your **recipe-web-app**.
2. Locate the application test URL (towards the top) and open it in a new browser tab.
3. The application home page should appear. Note the basic layout and navigation provided by Streamlit, with the python files from the `pages` folder displayed as navigational choices, and the `Home.py` loaded as the home page. Navigate to the **Cooking Advice** page.
4. After a few moments the chat interface will appear. Again, note the nice core layout provided by Streamlit.
5. Try a few cooking related questions and see how the bot functions. Something like:
¿Tienes algún consejo para preparar brócoli?
¿Qué tal una receta clásica de sopa de pollo?
Cuéntame sobre el merengue.
6. Now let's find a recipe or two. Navigate to the Recipe Search page and try a few searches. Something like:
Chili con carne
Chile, maíz y arroz
Pastel de merengue y limón
Un postre que contiene fresas
## Congratulations!
You have created an application leveraging Vertex AI Agent Builder applications. Along the way you've explored Gemini Cloud Assist, Gemini Code Assist, and the natural language to SQL features of BigQuery's Data Canvas. Fantastic job!