Descripción general

En este lab, usarás Gemini Code Assist, un colaborador de desarrollo de apps potenciado por IA de Google Cloud, para explicar, probar, documentar y mejorar una app.

Usarás Cloud Workstations para crear un entorno de desarrollo que tenga Code OSS como entorno de desarrollo integrado (IDE).

Este lab está dirigido a desarrolladores con diversos niveles de experiencia que crean apps. No es necesario que conozcas el desarrollo de apps en la nube.

Nota: Como tecnología en etapa inicial, Gemini puede generar resultados que parecen posibles, pero que no son correctos. Te recomendamos validar todos los resultados de Gemini antes de usarlos. Para obtener más información, consulta Gemini para Google Cloud y la IA responsable.

Objetivos

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

• Crear un entorno de desarrollo de apps basado en la nube con Cloud Workstations
• Usar Gemini Code Assist para explicar el código
• Generar pruebas de unidades con Gemini Code Assist
• Darle instrucciones a Gemini para mejorar el aspecto de una app
• Usar Gemini Code Assist para que el código sea más legible
• Usar Gemini Code Assist para agregar comentarios al código en inglés o en otro idioma

Configuración

En cada lab, recibirá un proyecto de Google Cloud y un conjunto de recursos nuevos por tiempo limitado y sin costo adicional.

1. Accede a Qwiklabs desde una ventana de incógnito.

2. Ten en cuenta el tiempo de acceso del lab (por ejemplo, 1:15:00) y asegúrate de finalizarlo en el plazo asignado.
   No existe una función de pausa. Si lo necesita, puede reiniciar el lab, pero deberá hacerlo desde el comienzo.

3. Cuando esté listo, haga clic en Comenzar lab.

4. Anote las credenciales del lab (el nombre de usuario y la contraseña). Las usarás para acceder a la consola de Google Cloud.

5. Haga clic en Abrir Google Console.

6. Haga clic en Usar otra cuenta, copie las credenciales para este lab y péguelas en el mensaje emergente que aparece.
   Si usa otras credenciales, se generarán errores o incurrirá en cargos.

7. Acepta las condiciones y omite la página de recursos de recuperación.

Active Cloud Shell

Cloud Shell es una máquina virtual que contiene herramientas de desarrollo y un directorio principal persistente de 5 GB. Se ejecuta en Google Cloud. Cloud Shell proporciona acceso de línea de comandos a sus recursos de Google Cloud. gcloud es la herramienta de línea de comandos de Google Cloud, la cual está preinstalada en Cloud Shell y es compatible con la función de autocompletado con tabulador.

1. En el panel de navegación de Google Cloud Console, haga clic en Activar Cloud Shell ().

2. Haga clic en Continuar.
   El aprovisionamiento y la conexión al entorno tardan solo unos momentos. Una vez que se conecte, también estará autenticado, y el proyecto estará configurado con su PROJECT_ID. Por ejemplo:

Comandos de muestra

• Si desea ver el nombre de cuenta activa, use este comando:

gcloud auth list

(Resultado)

Credentialed accounts: - <myaccount>@<mydomain>.com (active)

(Resultado de ejemplo)

Credentialed accounts: - google1623327_student@qwiklabs.net

• Si desea ver el ID del proyecto, use este comando:

gcloud config list project

(Resultado)

[core] project = <project_ID>

(Resultado de ejemplo)

[core] project = qwiklabs-gcp-44776a13dea667a6

Tarea 1: Configura tu entorno y tu cuenta

En esta tarea, habilitarás la API de Cloud AI Companion para Gemini y otorgarás los roles necesarios a una cuenta de usuario.

Configura APIs y roles

1. Accede a la consola de Google Cloud con tus credenciales de lab y abre una terminal de Cloud Shell presionando la tecla G y, luego, la tecla S.

2. En Google Shell, ejecuta los siguientes comandos para configurar tu ID del proyecto, el usuario y las variables de entorno de la región:

   export PROJECT_ID=$(gcloud config list project --format="value(core.project)") export USER=$(gcloud config list account --format "value(core.account)") export REGION={{{project_0.startup_script.lab_region| Lab Region}}} echo "PROJECT_ID=${PROJECT_ID}" echo "USER=${USER}" echo "REGION=${REGION}"

3. Para habilitar la API de Cloud AI Companion para Gemini y otorgar los roles necesarios a tu cuenta de usuario, ejecuta los siguientes comandos:

   gcloud services enable cloudaicompanion.googleapis.com --project ${PROJECT_ID} gcloud projects add-iam-policy-binding ${PROJECT_ID} --member user:${USER} --role=roles/cloudaicompanion.user gcloud projects add-iam-policy-binding ${PROJECT_ID} --member user:${USER} --role=roles/serviceusage.serviceUsageViewer

Para verificar este objetivo, haz clic en Revisar mi progreso. Habilitar las APIs correspondientes y establecer los roles de IAM

Tarea 2: Crea un Cloud Workstations

En este lab, se usa la asistencia de Gemini en el desarrollo de una aplicación con el complemento Cloud Code para el IDE de Cloud Workstations. Cloud Workstations es un entorno de desarrollo integrado completamente administrado que incluye integración nativa con Gemini.

En esta tarea, configurarás y aprovisionarás tu entorno de Cloud Workstations y habilitarás el complemento Cloud Code para Gemini.

Visualiza el clúster de estación de trabajo

En este lab, se creó con anterioridad un clúster de estación de trabajo llamado my-cluster. Este clúster se usa para configurar y crear la estación de trabajo.

1. Para abrir la página Workstations, en la barra de título de la consola de Google Cloud, escribe Cloud Workstations en el campo Buscar y, luego, haz clic en Cloud Workstations.

2. Si Cloud Workstations no está fijado (), en el menú de navegación (), haz clic en Fijar ().

3. En el panel de navegación, haz clic en Administración de clústeres.

4. Comprueba el Estado del clúster: Si el estado del clúster es En proceso de conciliación o Actualizando, actualiza la página periódicamente y espera hasta que pase a Listo antes de continuar con el siguiente paso.

Crea una configuración y una estación de trabajo

1. Para crear la estación de trabajo y su configuración, ejecuta los siguientes comandos en Cloud Shell:

   export CLUSTER_NAME=my-cluster export CONFIG_NAME=my-config export WS_NAME=my-workstation export REGION={{{project_0.startup_script.lab_region| Lab Region}}} gcloud workstations configs create ${CONFIG_NAME} --cluster=${CLUSTER_NAME} --region=${REGION} --machine-type="e2-standard-4" --pd-disk-size=200 --pd-disk-type="pd-standard" --pool-size=1 gcloud workstations create ${WS_NAME} --cluster=${CLUSTER_NAME} --config=${CONFIG_NAME} --region=${REGION}

   Espera a que finalicen los comandos.

2. En el panel de navegación, haz clic en Estaciones de trabajo.

   Una vez que se cree la estación de trabajo, aparecerá en Mis estaciones de trabajo con el estado Detenida.

3. Para iniciar la estación de trabajo, haz clic en Iniciar.

   Mientras se inicia la estación de trabajo, el estado pasará a Iniciando. Espera a que el estado pase a En ejecución, lo que indica que la estación está lista para usarse.

Inicia el IDE

Para que funcionen adecuadamente, algunas extensiones necesitan que las cookies de terceros estén habilitadas en tu navegador.

1. Para habilitar las cookies de terceros en Chrome, haz clic en Configuración en el menú de Chrome.

2. En la barra de búsqueda, escribe Cookies de terceros.

3. Haz clic en el parámetro de configuración de Cookies de terceros y selecciona Permitir cookies de terceros.

   Nota: Si deseas restablecer tu navegador a su configuración actual después de este lab, toma nota de la configuración original para las cookies de terceros.

4. Para ejecutar el IDE de Code OSS en la estación de trabajo, ve a la página de Estaciones de trabajo en la consola de Google Cloud y haz clic en Iniciar.

   El IDE se abre en otra pestaña del navegador.

   

Para verificar este objetivo, haz clic en Revisar mi progreso. Crear y ejecutar un Cloud Workstations

Tarea 3: Actualiza la extensión de Cloud Code para habilitar Gemini

En esta tarea, habilitarás Gemini en Cloud Code para tu IDE de estación de trabajo.

Conéctate a Google Cloud

Para conectarte a Google Cloud en tu estación de trabajo, realiza los siguientes pasos:

1. Para iniciar el flujo Cloud Code - Acceder, haz clic en Cloud Code - Acceder en la barra de estado en la parte inferior de la ventana y, luego, abre el vínculo que se muestra en la terminal en tu navegador.

2. Si se te pide que confirmes la apertura del sitio web externo, haz clic en Abrir.

3. Elige una cuenta para continuar a Gemini Code Assist y, luego, haz clic en Acceder.

   Tu código de verificación aparecerá en la pestaña del navegador.

   Nota: Es probable que veas una advertencia que indique que ejecutaste un comando de gcloud auth login. Este proceso es normal. El IDE ejecutó este comando por ti.

4. Haz clic en Copiar.

5. Regresa a la terminal del IDE y pega el código donde dice Ingresar código de autorización.

6. Si se te pide que apruebes la copia desde el portapapeles, haz clic en Permitir.

7. Presiona Intro y espera a que la barra de estado muestre Cloud Code - Sin proyecto.

   Ya te conectaste a Google Cloud.

Habilita Gemini en Cloud Code

Para habilitar Gemini en Cloud Code en el IDE de tu estación de trabajo, sigue los siguientes pasos:

1. En el IDE de tu estación de trabajo, haz clic en el menú () y, luego, ve a Archivo > Preferencias > Configuración.

2. En Configuración de búsqueda, escribe Gemini.

3. En la pestaña Usuario del diálogo Configuración, selecciona Extensiones > Gemini Code Assist.

4. En la página de configuración de Cloud Code, ingresa el ID del proyecto de Google Cloud en Geminicodeassist: Proyecto.

   

5. Para seleccionar el proyecto de Cloud Code, haz clic en Cloud Code - Sin proyecto en la barra de estado, en la parte inferior de la ventana. Luego, elige la opción Selecciona un proyecto de Google Cloud y selecciona .

   

   El ID del proyecto se muestra ahora en la barra de estado. Ya puedes usar Gemini.

Tarea 4: Descarga, examina y ejecuta una app de Flask en Python

Se guardó el código de una app de Flask en Python en un bucket de Cloud Storage.

En esta tarea, descargarás, examinarás y ejecutarás una app de Flask en Python en el IDE. Gemini Code Assist explica el código.

Accede a la terminal

1. En el menú del IDE (), elige Terminal > Terminal nueva.

2. En la terminal, ejecuta el siguiente comando:

   gcloud auth login

   Abre el vínculo que se muestra en la terminal en tu navegador.

3. Elige una cuenta para continuar con Sign in to Google Cloud SDK y, luego, haz clic en Continuar.

4. Por último, haz clic en Permitir en la ventana que indica Google Cloud SDK wants to access your Google Account.

   Tu código de verificación aparecerá en la pestaña del navegador.

   Nota: Es probable que veas una advertencia que indique que ejecutaste un comando de gcloud auth login. Este proceso es normal. El IDE ejecutó este comando por ti.

5. Haz clic en Copiar.

6. Regresa al IDE y pega el código en la terminal, donde dice Enter the verification code provided in your browser y, luego, presiona Intro.

   Tu sesión de terminal ahora está conectada a Google Cloud.

Instala el entorno virtual de Python

1. Para instalar Python de forma local en un entorno virtual, ejecuta los siguientes comandos:

   sudo apt update sudo apt -y upgrade sudo apt install -y python3-venv python3 -m venv ~/env source ~/env/bin/activate

2. Para verificar la ubicación de Python que se usará, ejecuta los siguientes comandos:

   which python3

Copia el código

1. Para copiar el código de la app, ejecuta el siguiente comando en la terminal:

   export PROJECT_ID={{{project_0.project_id | Project ID}}} export BUCKET_NAME=$PROJECT_ID-code gcloud storage cp -r gs://$BUCKET_NAME/* .

   El código se copió en un subdirectorio llamado codeassist-demo.

2. En la barra de actividad del IDE, haz clic en Explorador () y en Abrir carpeta.

3. En el cuadro de diálogo Abrir carpeta, haz clic en codeassist-demo y, luego, en Aceptar.

   Se muestra la estructura del directorio.

Examina el código

1. Selecciona main.py.

   El archivo de Python se abre en una ventana del editor.

2. En la barra de actividad del IDE, haz clic en Gemini Code Assist ().

   Gemini Code Assist es un colaborador potenciado por IA que ayuda con las tareas de desarrollo de apps.

3. En el panel de Gemini Code Assist, escribe la siguiente instrucción y, luego, haz clic en Send ():

   Explain this

   Las instrucciones son preguntas o sentencias que describen la ayuda que necesitas. Los mensajes pueden incluir contexto de código existente que Google Cloud analiza para proporcionar respuestas más útiles o completas. Para obtener más información para escribir instrucciones que generen respuestas correctas, consulta Escribe mejores instrucciones para Gemini en Google Cloud.

   Gemini explicará el código en main.py. La respuesta podría explicar estas secciones:

   • Dependencias
   • Configuración de la aplicación
   • Rutas
   • Ejecución de la aplicación

   Cuando selecciones el código, la misma instrucción hará que Gemini Code Assist explique solo el código seleccionado.

   Nota: El estado del historial de chat se mantiene solo en memoria y no persiste cuando se cambia a otro espacio de trabajo o cuando se cierra el IDE. Gemini no usa tus instrucciones ni sus respuestas como datos para entrenar su modelo. Para obtener más información, consulta Cómo Gemini para Google Cloud usa tus datos.

4. En el editor, selecciona la definición de app.route y la función para la ruta POST /convert, haz clic en la bombilla () y, luego, en Gemini: Explain this.

   

   Gemini explicará el código seleccionado en detalle.

Ejecuta la app

1. Si la terminal se cerró, en el menú del IDE (), elige Terminal > Terminal nueva.

2. En la terminal, ejecuta los siguientes comandos:

   cd ~/codeassist-demo source ~/env/bin/activate python3 main.py

   El comando devuelve un error que indica que no hay un módulo llamado flask. Puedes usar Gemini Code Assist para ayudarte a comprender el problema.

3. En el panel de chat de Gemini Code Assist, escribe la siguiente instrucción:

   How do you install Python requirements?

   Es probable que Gemini Code Assist mencione que puedes usar el instalador de paquetes pip y un archivo requirements.txt para instalar los requisitos de Python.

4. En la barra de actividad del IDE, haz clic en Explorador () y, luego, en requirements.txt.

   Flask y su versión requerida se indican en el archivo requirements.txt.

5. En la terminal, ejecuta el siguiente comando:

   pip install -r requirements.txt

   Flask ya está instalado.

6. En la terminal, ejecuta el siguiente comando:

   python3 main.py

   Un diálogo indica que el servicio que escucha en el puerto 8080 ahora está disponible para la vista previa en la Web.

7. Haz clic en Abrir vista previa y, luego, ‏en Abrir.

   La app web Roman Numerals se abrirá en una pestaña nueva.

8. En el cuadro de números, ingresa 123 y, luego, haz clic en Convert.

   El número que se devuelve es CXXIII. C es 100, X es 10 y I es 1. Esto parece correcto.

9. Haz clic en Return to home page, ingresa 45 y, luego, haz clic en Convert.

   El número que se devuelve es XXXXV. Técnicamente, esto es correcto desde el punto de vista matemático (4 veces 10 más 5), pero la representación normal de 40 es XL (50 menos 10) y, por lo tanto, la representación más tradicional de los números romanos es XLV.

   Veremos eso más adelante.

10. En la barra de actividad del IDE, haz clic en Explorer () y en calendar.py.

    La función number_to_roman convierte un número en un numeral romano.

Para verificar este objetivo, haz clic en Revisar mi progreso. Copiar código y ejecutar una app de Flask en Python

Tarea 5: Agrega pruebas de unidades

En esta tarea, usarás Gemini Code Assist para generar pruebas de unidades para tu código.

1. En la barra de actividad del IDE, haz clic en Gemini Code Assist () y, luego, ingresa la siguiente instrucción:

   Create unit tests for a fixed version of number_to_roman

   Gemini Code Assist reconoce el código en la pestaña abierta de calendar.py. Debería proporcionar un código de ejemplo similar a este:

   import unittest import calendar class TestNumberToRoman(unittest.TestCase): def test_basic_conversions(self): self.assertEqual(calendar.number_to_roman(1), "I") self.assertEqual(calendar.number_to_roman(5), "V") self.assertEqual(calendar.number_to_roman(10), "X") self.assertEqual(calendar.number_to_roman(50), "L") self.assertEqual(calendar.number_to_roman(100), "C") self.assertEqual(calendar.number_to_roman(500), "D") self.assertEqual(calendar.number_to_roman(1000), "M") def test_combinations(self): self.assertEqual(calendar.number_to_roman(4), "IV") self.assertEqual(calendar.number_to_roman(9), "IX") self.assertEqual(calendar.number_to_roman(14), "XIV") self.assertEqual(calendar.number_to_roman(40), "XL") self.assertEqual(calendar.number_to_roman(90), "XC") self.assertEqual(calendar.number_to_roman(400), "CD") self.assertEqual(calendar.number_to_roman(900), "CM") self.assertEqual(calendar.number_to_roman(1994), "MCMXCIV") self.assertEqual(calendar.number_to_roman(3888), "MMMDCCCLXXXVIII") def test_edge_cases(self): self.assertEqual(calendar.number_to_roman(0), "") # Se debería encargar del cero self.assertRaises(TypeError, calendar.number_to_roman, "abc") # Se debería encargar de las entradas no válidas def test_large_numbers(self): self.assertEqual(calendar.number_to_roman(3000), "MMM") self.assertEqual(calendar.number_to_roman(3999), "MMMCMXCIX") if __name__ == '__main__': unittest.main() Nota: Gemini puede crear pruebas de unidades positivas para tu código tal como está implementado actualmente, en lugar de crear pruebas positivas cuando el código siga correctamente la implementación estándar de los números romanos. Para los fines de este lab, usarás una versión correcta de las pruebas de unidades.

2. Para detener la app en ejecución, presiona CTRL + C en la terminal.

3. Para crear pruebas de unidades para la función de conversión, ejecuta los siguientes comandos en la terminal:

   cat > ~/codeassist-demo/test_calendar.py <<EOF import unittest import calendar class TestNumberToRoman(unittest.TestCase): def test_basic_conversions(self): self.assertEqual(calendar.number_to_roman(1), "I") self.assertEqual(calendar.number_to_roman(5), "V") self.assertEqual(calendar.number_to_roman(10), "X") self.assertEqual(calendar.number_to_roman(50), "L") self.assertEqual(calendar.number_to_roman(100), "C") self.assertEqual(calendar.number_to_roman(500), "D") self.assertEqual(calendar.number_to_roman(1000), "M") def test_combinations(self): self.assertEqual(calendar.number_to_roman(4), "IV") self.assertEqual(calendar.number_to_roman(9), "IX") self.assertEqual(calendar.number_to_roman(14), "XIV") self.assertEqual(calendar.number_to_roman(40), "XL") self.assertEqual(calendar.number_to_roman(90), "XC") self.assertEqual(calendar.number_to_roman(400), "CD") self.assertEqual(calendar.number_to_roman(900), "CM") self.assertEqual(calendar.number_to_roman(1994), "MCMXCIV") self.assertEqual(calendar.number_to_roman(3888), "MMMDCCCLXXXVIII") def test_edge_cases(self): self.assertEqual(calendar.number_to_roman(0), "") # Se debería encargar del cero self.assertRaises(TypeError, calendar.number_to_roman, "abc") # Se debería encargar de las entradas no válidas def test_large_numbers(self): self.assertEqual(calendar.number_to_roman(3000), "MMM") self.assertEqual(calendar.number_to_roman(3999), "MMMCMXCIX") if __name__ == '__main__': unittest.main() EOF

4. Para ejecutar las pruebas, ejecuta los siguientes comandos en la terminal:

   cd ~/codeassist-demo python3 test_calendar.py

   Las pruebas fallarán:

   ====================================================================== ERROR: test_edge_cases (__main__.TestNumberToRoman.test_edge_cases) ---------------------------------------------------------------------- Traceback (most recent call last): File "/home/user/codeassist-demo/test_calendar.py", line 28, in test_edge_cases self.assertRaises(TypeError, calendar.number_to_roman, "abc") # Should handle invalid input ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/usr/lib/python3.12/unittest/case.py", line 778, in assertRaises return context.handle('assertRaises', args, kwargs) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/usr/lib/python3.12/unittest/case.py", line 238, in handle callable_obj(*args, **kwargs) File "/home/user/codeassist-demo/calendar.py", line 16, in number_to_roman number = int(number) ^^^^^^^^^^^ ValueError: invalid literal for int() with base 10: 'abc' ====================================================================== FAIL: test_combinations (__main__.TestNumberToRoman.test_combinations) ---------------------------------------------------------------------- Traceback (most recent call last): File "/home/user/codeassist-demo/test_calendar.py", line 16, in test_combinations self.assertEqual(calendar.number_to_roman(4), "IV") AssertionError: 'IIII' != 'IV' - IIII + IV ====================================================================== FAIL: test_large_numbers (__main__.TestNumberToRoman.test_large_numbers) ---------------------------------------------------------------------- Traceback (most recent call last): File "/home/user/codeassist-demo/test_calendar.py", line 33, in test_large_numbers self.assertEqual(calendar.number_to_roman(3999), "MMMCMXCIX") AssertionError: 'MMMDCCCCLXXXXVIIII' != 'MMMCMXCIX' - MMMDCCCCLXXXXVIIII + MMMCMXCIX ---------------------------------------------------------------------- Ran 4 tests in 0.004s FAILED (failures=2, errors=1)

   Los errores fueron los siguientes:

   • abc no se manejó correctamente.
   • 4 devolvió IIII en lugar de IV.
   • 3999 devolvió MMMDCCCCLXXXXVIIII en lugar de MMMCMXCIX.

   En cada función de prueba, el primer error que se encuentra hace que la función finalice.

   Nota: Es posible que los resultados sean diferentes si el código de la prueba es diferente.

Para verificar este objetivo, haz clic en Revisar mi progreso. Crear pruebas de unidades para la función convert

Tarea 6: Corrige el código y hazlo más legible

En esta tarea, usarás Gemini Code Assist para corregir el código y hacerlo más legible.

1. En la barra de actividad del IDE, haz clic en Explorador () y, luego, en calendar.py.

2. En la barra de actividad del IDE, haz clic en Gemini Code Assist () y, luego, ingresa la siguiente instrucción:

   Make my code more readable and fix any errors

   Gemini Code Assist proporcionará mejoras en la legibilidad del código y, probablemente, solucionará el problema. A continuación, se muestra un ejemplo:

   def number_to_roman(number): """Converts an integer to its Roman numeral equivalent. Args: number: An integer between 0 and 3999. Returns: A string representing the Roman numeral equivalent of the number. Returns an empty string if the input is 0. Raises TypeError if the input is not an integer or is out of range. """ try: number = int(number) except ValueError: raise TypeError("Input must be an integer.") if not 0 <= number <= 3999: raise TypeError("Input must be between 0 and 3999.") if number == 0: return "" roman_map = { 1000: 'M', 900: 'CM', 500: 'D', 400: 'CD', 100: 'C', 90: 'XC', 50: 'L', 40: 'XL', 10: 'X', 9: 'IX', 5: 'V', 4: 'IV', 1: 'I'} result = "" for value, numeral in roman_map.items(): while number >= value: result += numeral number -= value return result

   Gemini Code Assist también explica los cambios que se realizaron:

   Key improvements: 1. Error Handling: Added TypeError for non-integer input and values outside the range 0-3999. This makes the function more robust. 2. Docstring: A clear docstring explains the function's purpose, arguments, return value, and error handling. This significantly improves readability and maintainability. 3. Efficiency and Correctness: Uses a roman_map dictionary and a more efficient algorithm to construct the Roman numeral. This handles subtractive notation (like "IV" for 4, "IX" for 9, etc.) correctly. The previous version had issues with these cases and was less efficient. 4. Zero Handling: Explicitly handles the case where the input number is 0, returning an empty string as expected. 5. Clarity: The code is now more concise and easier to understand. The logic is clearer and the variable names are more descriptive. This revised version addresses the limitations and errors of the original implementation and adheres to best practices for Python code. It's more robust, readable, and efficient.

   En este ejemplo, Gemini Code Assist proporcionó un algoritmo que hizo que el código fuera más legible y también corrigió problemas en el código original.

3. Para comparar el código en un archivo nuevo, en el panel de código dentro de Gemini Code Assist, haz clic en Diff with Open File ().

4. Para aceptar los cambios, haz clic en Aceptar. Se acepta el código actualizado.

5. En la terminal, ejecuta los siguientes comandos:

   cd ~/codeassist-demo python3 test_calendar.py

   Si las pruebas no son positivas, intenta ejecutarlas varias veces para asegurarte de que no estén usando una versión almacenada en caché del módulo de calendario.

   Si Gemini no corrigió el problema de los números romanos, algunas pruebas fallarán. Si esto sucede, puedes corregir el código por tu cuenta hasta que la prueba sea positiva o puedes reemplazar calendar.py por una versión que funcione.

6. Si algunas pruebas fallan, para corregir el código y volver a ejecutar las pruebas de unidades, ejecuta los siguientes comandos:

   cat > ~/codeassist-demo/calendar.py <<EOF def number_to_roman(number): """Converts an integer to its Roman numeral equivalent. Args: number: An integer between 0 and 3999. Returns: A string representing the Roman numeral equivalent of the number. Returns an empty string if the input is 0. Raises TypeError if the input is not an integer or is out of range. """ try: number = int(number) except ValueError: raise TypeError("Input must be an integer.") if not 0 <= number <= 3999: raise TypeError("Input must be between 0 and 3999.") if number == 0: return "" roman_map = { 1000: 'M', 900: 'CM', 500: 'D', 400: 'CD', 100: 'C', 90: 'XC', 50: 'L', 40: 'XL', 10: 'X', 9: 'IX', 5: 'V', 4: 'IV', 1: 'I'} result = "" for value, numeral in roman_map.items(): while number >= value: result += numeral number -= value return result EOF cd ~/codeassist-demo python3 test_calendar.py

   Ahora, las pruebas deberían ser positivas.

Para verificar este objetivo, haz clic en Revisar mi progreso. Actualizar calendar.py para corregir problemas en el código original

Tarea 7: Mejora la legibilidad del código para hablantes no nativos de inglés

Si no eres hablante no nativo de inglés y dependes de una app de traducción, puedes usar Gemini Code Assist para generar comentarios en otros idiomas.

En esta tarea, usarás Gemini Code Assist para agregar comentarios al código, incluso en otro idioma.

1. En la barra de actividad del IDE, haz clic en Explorador () y, luego, en main.py.

2. En la barra de actividad del IDE, haz clic en Gemini Code Assist () y, luego, ingresa la siguiente instrucción:

   Add comments to main.py

   Gemini Code Assist agregará comentarios que ayudarán a explicar el código:

   import os # Importa el módulo os para las variables de entorno from flask import Flask, render_template, request # Importa los componentes del framework Flask import calendar # Importa el módulo calendar para la conversión a números romanos # Crea una instancia de la aplicación Flask app = Flask(__name__) # Define una ruta para la página de inicio @app.route("/", methods=["GET"]) def home_page(): # Renderiza la plantilla index.html return render_template("index.html") # Define una ruta para el extremo de acceso de conversión @app.route("/convert", methods=["POST"]) def convert(): # Obtiene el número de los datos del formulario number = request.form["number"] # Convierte el número a números romanos usando el módulo calendar roman = calendar.number_to_roman(number) # Renderiza la plantilla convert.html con el número y su equivalente en números romanos return render_template("convert.html", number=number, roman=roman) # Ejecuta la aplicación Flask si esta secuencia de comandos se ejecuta directamente if __name__ == "__main__": # Ejecuta la aplicación en modo de depuración, escuchando en todas las interfaces (0.0.0.0) # y usando el puerto especificado en la variable de entorno PORT o el valor predeterminado 8080 app.run(debug=True, host="0.0.0.0", port=int(os.environ.get("PORT", 8080)))

   ¿Qué sucede si el inglés no es tu lengua materna?

3. En el panel de Gemini Code Assist, ingresa la siguiente instrucción:

   Add Spanish comments to main.py

   Gemini Code Assist puede proporcionar comentarios en diferentes idiomas para ayudar a la legibilidad del código.

4. Para verificar que solo se agregaron comentarios, en el panel de código de Gemini Code Assist, haz clic en Diff with Open File ().

   Las actualizaciones se comparan con el código existente:

   

5. Para rechazar los cambios, haz clic en Rechazar.

Tarea 8: Mejora el aspecto de la app

Gemini Code Assist también puede ayudarte a que tu app se vea mejor.

En esta tarea, usarás Gemini Code Assist para mejorar el diseño visual de tu app.

1. En la terminal, ejecuta el siguiente comando:

   cd ~/codeassist-demo python3 main.py

   Un diálogo indica que el servicio que escucha en el puerto 8080 ahora está disponible para la vista previa en la Web.

2. Haz clic en Abrir vista previa y, luego, ‏en Abrir.

   La app web Roman Numerals se abrirá en una pestaña nueva.

   

3. En la barra de actividad del IDE, haz clic en Explorador () y, luego, selecciona templates/index.html.

   La plantilla HTML de esta app es muy simple.

4. En la barra de actividad del IDE, haz clic en Gemini Code Assist () y, luego, ingresa la siguiente instrucción:

   Make this HTML template look better

   Gemini Code Assist actualizará el código para mejorar el aspecto de la página de entrada de la app.

5. Para aceptar los cambios, en el panel de código dentro de Gemini Code Assist, haz clic en Diff with Open File () y, luego, en Aceptar.

6. Regresa a la pestaña del navegador de la app Roman Numerals y haz clic en Actualizar.

   La app debería verse mejor. En este ejemplo, el diálogo está centrado en la página y se agregaron colores.

   

   Nota: Es posible que los cambios realizados por Gemini Code Assist se vean diferentes para ti.

7. En la barra de actividades del IDE, haz clic en Explorador () y, a continuación, en templates/convert.html.

8. En la barra de actividad del IDE, haz clic en Gemini Code Assist () y, luego, ingresa la siguiente instrucción:

   Make the convert.html template look similar to the index.html template

   Gemini Code Assist actualizará la plantilla de resultados para que coincida con la plantilla de índice.

9. Para aceptar los cambios, en el panel de código dentro de Gemini Code Assist, haz clic en Diff with Open File () y, luego, en Aceptar.

10. Regresa a la pestaña del navegador de la app Roman Numerals, ingresa 45 y, luego, haz clic en Enter.

    La nueva página de resultados debe coincidir con el estilo de la página de índice:

    

Para verificar este objetivo, haz clic en Revisar mi progreso. Usar Gemini Code Assist para mejorar el diseño visual de tu app

Finalice su lab

Cuando haya completado su lab, haga clic en Finalizar lab. Qwiklabs quitará los recursos que usó y limpiará la cuenta por usted.

Tendrá la oportunidad de calificar su experiencia en el lab. Seleccione la cantidad de estrellas que corresponda, ingrese un comentario y haga clic en Enviar.

La cantidad de estrellas indica lo siguiente:

• 1 estrella = Muy insatisfecho
• 2 estrellas = Insatisfecho
• 3 estrellas = Neutral
• 4 estrellas = Satisfecho
• 5 estrellas = Muy satisfecho

Puede cerrar el cuadro de diálogo si no desea proporcionar comentarios.

Para enviar comentarios, sugerencias o correcciones, use la pestaña Asistencia.

¡Felicitaciones!

En este lab, aprendiste a realizar las siguientes tareas:

• Crear un entorno de desarrollo de apps basado en la nube con Cloud Workstations
• Usar Gemini Code Assist para explicar el código
• Generar pruebas de unidades con Gemini Code Assist
• Darle instrucciones a Gemini para mejorar el aspecto de una app
• Usar Gemini Code Assist para que el código sea más legible
• Usar Gemini Code Assist para agregar comentarios al código en inglés o en otro idioma

Próximos pasos/Más información

• Descripción general de Gemini Code Assist
• Crea código con Gemini Code Assist

Copyright 2024 Google LLC. Todos los derechos reservados. Google y el logotipo de Google son marcas de Google LLC. El resto de los nombres de productos y empresas pueden ser marcas de las respectivas empresas a las que están asociados.