Desarrolla una app de Node.js con Gemini para la asistencia de Google Cloud

En este instructivo, se muestra cómo usar Gemini para Google Cloud, un servicio potenciado por IA de Google Cloud para explorar, crear, modificar, probar e implementar app de ejemplo de Node.js.

Para los siguientes pasos, considera que eres desarrollador de Node.js y quieres escribir una aplicación web sencilla en JavaScript que use un formulario básico. En este usarás el framework Express para la app y las plantillas EJS para al formulario HTML.

Esta guía está dirigida a los desarrolladores de Node.js que deseen utilizar Gemini para acelerar el proceso de desarrollo. Se supone que los conceptos básicos de la nube, aunque no necesariamente Google Cloud.

Objetivos

Con este instructivo aprenderás a usar Gemini para hacer lo siguiente: lo siguiente:

  • Desarrollar una app web de Node.js en Cloud Shell
  • Crea pruebas de unidades para la app web de Node.js.
  • Implementar la app web de Node.js en Cloud Run

Productos de Google Cloud usados

En este instructivo, se usan los siguientes productos de Google Cloud.

  • Gemini: Un colaborador siempre activo en Google Cloud que ofrece asistencia potenciada por IA generativa a una amplia variedad de usuarios, incluidos desarrolladores y científicos de datos. Para brindar una solución integrada experiencia de asistencia, Gemini está integrado en muchos en todos los productos de Google Cloud.
  • Complemento de Cloud Code para Cloud Shell: Es un complemento IDE. que proporciona compatibilidad con el ciclo de desarrollo para apps que se ejecutarán en Google Cloud.
  • Cloud Run: Un servicio completamente administrado que te permite compilar e implementar apps alojadas en contenedores. Google Cloud se encarga del escalamiento y otras de infraestructura para que puedas enfocarte en la lógica empresarial de tu código. Para obtener información sobre los precios, consulta la Precios de Cloud Run y utiliza la Calculadora de precios para generar una estimación de costos según el uso previsto.

Antes de comenzar

  1. Crea un proyecto de Google Cloud Si no tienes un proyecto de Google Cloud existente que pueda usarse, para este instructivo.
  2. Activa Cloud Shell.
  3. Asegúrate de que Gemini esté configurado para tu cuenta de usuario y proyecto de Google Cloud.
  4. Habilitar Gemini para Cloud Shell Para ello, seleccione el proyecto al que se le otorgó acceso funciones de Gemini.

Indica a Gemini que genere código de Node.js

Gemini puede ayudarte a generar código de Node.js basado en las instrucciones que proporciones en el chat y las descripciones que escribas en los comentarios del código. El más código escribes y más contexto le proporcionas a Gemini, mejor podrá ayudarte Gemini a desarrollar tu app. Nota que las respuestas de Gemini pueden variar según cómo le preguntes preguntas o describe el contexto, por lo que es una buena práctica revisar las respuestas de Gemini antes de aceptar las sugerencias durante el proceso de desarrollo.

Antes de pedirle a Gemini que te ayude a generar código de partida, usa el en la terminal de Cloud Shell para crear un directorio vacío archivos.

mkdir node-js-with-gemini
cd node-js-with-gemini
touch app.js test.js

En el Editor de Cloud Shell, selecciona content_copy Explorer y abre el que acabas de crear en la terminal de Cloud Shell.

Instalar paquetes

Sabes que quieres instalar los paquetes express y ejs para tu App de Node.js. Para pedirle ayuda a Gemini con la instalación paquetes, sigue estos pasos:

  1. En el panel lateral izquierdo del Editor de Cloud Shell, haz clic en spark de Gemini.

  2. En el panel de Gemini, ingresa una instrucción como la siguiente:

    What is the command to install express and ejs packages for node.js?

  3. Haz clic en Enviar Enviar.

    Gemini devuelve una respuesta que será similar a la lo siguiente:

    Para instalar los paquetes Express y EJ para Node.js, puedes usar el siguiente comando:

    npm install express ejs
    
  4. Copia el comando que proporciona Gemini y ejecútalo en tu Terminal de Cloud Shell.

Crear archivos de la aplicación

Después de instalar los paquetes, usa Gemini para obtener orientación sobre cómo agrega los paquetes instalados en tu archivo app.js.

  1. Abre el archivo app.js en el editor de Cloud Shell.
  2. En el chat de Gemini, ingresa una instrucción como la siguiente:

    How do I add these packages to my app.js file?

    La respuesta de Gemini será similar a la siguiente:

    Para agregar los paquetes Express y EJ al archivo app.js, puedes usar el siguiente código:

    const express = require('express');
    const ejs = require('ejs');
    

    Esto requerirá los paquetes Express y Ex, y los pondrá a disposición usar en el archivo app.js.

  3. Agrega el código que proporciona Gemini a tu archivo app.js.

Genera código con comentarios

El complemento de Cloud Code tiene una función que le permite a Gemini usar comentarios de archivos para generar código. Por ejemplo, si agregas un comentario marcador de posición en el archivo, puedes indicarle a Gemini que genere código como se describe en el comentario.

Para usar esta función en tu archivo app.js, asegúrate de que Gemini esté habilitado en el Editor de Cloud Shell.

  1. Al final del archivo, agrega un marcador de posición de comentario para inicializar el sitio web. . Por ejemplo:

    // Initialize express web app using ejs templating engine
    
  2. Mueve el cursor de texto hasta el final del comentario y presiona Control+Enter (para Windows y Linux) o Control+Return (para MacOS), Luego, presiona Tab para usar las capacidades de generación de código de Gemini para generar el código.

    La respuesta de Gemini tendrá dos líneas de código debajo de la comentario similar al siguiente:

    // Initialize express web app using ejs templating engine
    
    const app = express();
    app.set('view engine', 'ejs');
    

    Si el resultado de la generación de código es diferente de lo que esperabas, modifícalo o borra el contenido adicional como creas conveniente.

A continuación, agrega más comentarios para generar las capacidades de base para tu sitio web de Express .

  1. Ve a la parte inferior del archivo app.js y agrega los siguientes comentarios:

    // add urlencoded middleware to parse form data
    
    // define the home route
    
    // create a /greeting POST route with a `name` parameter
    
    // create a /greeting route that accepts a name parameter
    
    // start the server on port 8080
    
  2. Genera un código para cada comentario de archivo de manera similar a como generaste el código antes.

  3. Antes de aceptar las sugerencias, revisa que el código generado sea correcto.

    Los comentarios de tu archivo app.js ahora deberían estar acompañados de el código correspondiente, similar al siguiente:

    // add urlencoded middleware to parse form data
    app.use(express.urlencoded({ extended: true }));
    
    // define the home route
    app.get('/', (req, res) => {
      res.render('index');
    });
    
    // create a /greeting POST route with a `name` parameter
    app.post('/greeting', (req, res) => {
      const name = req.body.name || 'World';
      res.render('greeting', { name });
    });
    
    // start the server
    const port = process.env.PORT || 8080;
    app.listen(port, () => {
      console.log(`App listening on port ${port}`);
      console.log('Press Ctrl+C to quit.');
    });
    
    // create a /greeting route that accepts a name parameter
    app.get('/greeting/:name', (req, res) => {
      res.render('greeting', { name: req.params.name });
    });
    

Crea un archivo package.json

Luego de que se genere el código para tu aplicación de base, crea y agrega contenido al archivo package.json.

  1. Crea un archivo package.json en el mismo directorio que el archivo app.js.
  2. En el Editor de Cloud Shell, selecciona spark Gemini y, luego, ingresa una instrucción como:

    Based on my app.js file, can you create a package.json file?

    La respuesta de Gemini debería sugerir la secuencia de comandos de inicio y las dependencias que especifiques y será similar a lo siguiente:

    Por supuesto. Este es un archivo package.json que puedes usar con tu app.js archivo:

    {
      "name": "my-app",
      "version": "1.0.0",
      "description": "A simple Node.js web app using Express and EJS.",
      "main": "app.js",
      "scripts": {
        "start": "node app.js"
      },
    
      "dependencies": {
        "express": "^4.17.1",
        "ejs": "^3.1.6"
      }
    }
    

    Este archivo package.json incluye la siguiente información:

    El nombre de la app (my-app)
    La versión de la app (1.0.0)
    Una descripción de la app (una app web sencilla de Node.js que usa Express y EJS)
    El archivo principal de la app (app.js)
    Las secuencias de comandos que se pueden ejecutar en la app (inicio)
    Las dependencias de la app (expresa y expulsa)

  3. Copia y pega solo el contenido que proporciona Gemini en el archivo package.json.

Crear plantillas de EJ

Para finalizar tu app web, crea un directorio views para tus plantillas de ejs en el mismo directorio que tus archivos app.js y package.json.

  1. En la terminal, ingresa lo siguiente:

    mkdir views
    touch views/index.ejs views/greeting.ejs
    
  2. Abre el archivo index.ejs en el editor y pega lo siguiente:

    <html>
    <body>
        <form action="/greeting" method="post">
        <label for="name">What's your name?</label>
        <input type="text" id="name" name="name" autofocus />
        <button type="submit">Submit</button>
        </form>
    </body>
    </html>
    
  3. Abre el archivo greeting.ejs en el editor y pega lo siguiente:

    <html>
    <body>
        <a href="/">Home</a>
        <p>Hello <%= name %>~</p>
    </body>
    </html>
    

Obtén una vista previa de la app en un navegador

Una vez completados el código, las plantillas y los requisitos de tu app, puedes confirmar si tu app funciona.

  1. Ejecuta el siguiente comando para instalar las dependencias.

    npm install
    
  2. Ejecuta el siguiente comando para iniciar la app:

    npm start
    
  3. Confirma que la app funcione. Selecciona el botón Vista previa en la Web ubicado en la parte superior. a la derecha de la barra de tareas de Cloud Shell. Luego, selecciona el número de puerto de el menú que se muestra. Cloud Shell abre la URL de vista previa en una nueva ventana del navegador.

Cómo escribir pruebas de unidades

Luego de confirmar que la app de Node.js funciona, puedes escribir pruebas de unidades en tu test.js antes de implementar tu app en Cloud Run. En la siguiente ejemplo, le pedirás a Gemini que te ayude en generar una prueba de unidades para cuando el código de respuesta HTTP sea 200.

  1. En la parte inferior del archivo app.js, agrega la siguiente línea para exportar el archivo de tu app.

    module.exports = app;
    
  2. Abre el archivo test.js.

  3. Para probar cuándo la respuesta muestra un código de estado HTTP 200, abre la Panel del chat de Gemini y escribe una instrucción como la siguiente:

    Can you generate a unit test for my home route in app.js to assert that the response code is 200?

    Gemini debería responder con algo similar a lo siguiente: lo siguiente:

    Por supuesto. Esta es una prueba de unidades para la ruta principal en app.js que garantiza el código de respuesta es 200:

    const assert = require('assert');
    const request = require('supertest');
    
    const app = require('./app.js');
    describe('GET /', () => {
      it('should return a 200 response code', async () => {
        const response = await request(app).get('/');
        assert.equal(response.status, 200);
      });
    });
    

    Esta prueba verifica que la ruta principal muestre un código de estado de 200.

    Agrega el bloque de código sugerido a tu archivo test.js.

  4. Instala los paquetes mocha test y supertest. Para ello, ejecuta el siguiente comando: en tu terminal:

    npm i mocha supertest
    
  5. Actualiza el archivo package.json para incluir la nueva secuencia de comandos de prueba y su paquetes. Por ejemplo:

    {
      "name": "my-app",
      "version": "1.0.0",
      "description": "A simple Node.js web app using Express and EJS.",
      "main": "app.js",
      "scripts": {
        "start": "node app.js",
        "test": "mocha"
      },
      "dependencies": {
      "express": "^4.17.1",
      "ejs": "^3.1.6",
      "mocha": "^10.2.0",
      "supertest": "^6.3.3"
      }
    }
    
  6. Ejecuta el siguiente comando para ejecutar las pruebas:

    npm test
    

La prueba se mostrará como aprobada si no hay errores. Si quieres agregar pruebas adicionales para tus otras rutas, sigue solicitándole a Gemini para obtener sugerencias para agregar a tu archivo test.js.

Implementa en Cloud Run

Ahora que tu app se ejecuta de forma local, puedes continuar con la implementación en en Google Cloud. Cloud Run funciona bien para esta situación ya que permite implementar desde el código fuente sin tener que administrar cuando ejecutas la app.

  1. En el chat de Gemini, pregúntale cómo realizar la implementación a Cloud Run directamente desde tu código fuente con gcloud:

    What is the gcloud command for deploying a Cloud Run service from source code?

    Gemini debería responder con algo similar a lo siguiente:

    Puedes implementar directamente en Cloud Run desde tu código fuente en tu directorio actual con gcloud. Para ello, puedes Usa el comando gcloud run deploy con --source flag Esta marca le indica a gcloud que use tu para compilar una imagen de contenedor y, luego, implementarla en Cloud Run.

    Por ejemplo, para implementar el código del archivo app.js en Cloud Run, usarías el siguiente comando:

    gcloud run deploy app --source .
    

    Este comando compilará una imagen de contenedor desde tu archivo app.js y, luego, la implementará en Cloud Run.

    También puedes usar la marca --region para especificar la región implementar tu app. Por ejemplo, para implementar tu app en la región us-central1, usarías el siguiente comando:

    gcloud run deploy app --source . --region us-central1
    

    Obtén más información sobre la implementación en Cloud Run desde el código fuente. código, puedes consultar la documentación de Cloud Run.

  2. Usa el comando de gcloud que proporcionó Gemini en la respuesta.

  3. Sigue las instrucciones para seleccionar una región y selecciona la opción para permitir invocaciones no autenticadas de la app de prueba. Después de implementar la app correctamente, el resultado devolverá una URL de servicio.

Limpia

Para evitar que se apliquen cargos a tu cuenta de Google Cloud por los recursos que usaste en este instructivo, puedes borrar el proyecto de Google Cloud que para este instructivo. Como alternativa, puedes borrar los recursos individuales.

  1. Precaución: Borrar un proyecto tiene las siguientes consecuencias:
    • Se borra todo en el proyecto. Si usaste un proyecto existente para las tareas de este documento, si lo borras, también borrarás cualquier otro trabajo que hayas realizado en el proyecto.
    • Se pierden los ID personalizados de proyectos. Cuando creaste este proyecto, Es posible que hayas creado un ID del proyecto personalizado que quieras usar en el en el futuro. Para conservar las URLs que utilizan el ID del proyecto, como un URL de appspot.com, borra los recursos seleccionados dentro del proyecto en lugar de borrar todo el proyecto.
  2. Si planeas explorar varias arquitecturas, instructivos o de inicio rápido, la reutilización de proyectos puede ayudarte a evitar exceder la cuota del proyecto En la consola de Google Cloud, ve a la página Administrar recursos.

    Ir a Administrar recursos

  3. En la lista de proyectos, selecciona el que quieres borrar. y, luego, haz clic en Borrar.

  4. En el diálogo, escribe el ID del proyecto y, luego, haz clic en Cerrar para borrar el proyecto.

¿Qué sigue?