Desarrollo de InnerLoop con NodeJS

1. Descripción general

En este lab, se muestran las funciones y capacidades diseñadas para optimizar el flujo de trabajo de desarrollo de los ingenieros de software encargados de desarrollar aplicaciones de NodeJS en un entorno alojado en contenedores. El desarrollo típico de contenedores requiere que el usuario comprenda sus detalles y el proceso de compilación de estos. Además, por lo general, los desarrolladores tienen que interrumpir el flujo y salir del IDE para probar y depurar sus aplicaciones en entornos remotos. Con las herramientas y tecnologías mencionadas en este instructivo, los desarrolladores pueden trabajar de manera eficaz con aplicaciones alojadas en contenedores sin salir de su IDE.

Qué aprenderás

En este lab, aprenderás métodos para desarrollar con contenedores en GCP, incluidos los siguientes:

• Crea una aplicación de inicio de Nodejs
• Configurar la aplicación de Nodejs para el desarrollo de contenedores
• Programación de un servicio simple de REST de CRUD
• Implementar en GKE
• Depura un estado de error
• Usa puntos de interrupción o registros
• Implementando cambios en caliente de vuelta en GKE
• Opcional: Integra Cloud SQL para la persistencia del backend

2. Configuración y requisitos

Cómo configurar el entorno a tu propio ritmo

1. Accede a Google Cloud Console y crea un proyecto nuevo o reutiliza uno existente. Si aún no tienes una cuenta de Gmail o de Google Workspace, debes crear una.

• El Nombre del proyecto es el nombre visible de los participantes de este proyecto. Es una string de caracteres que no se utiliza en las API de Google y se puede actualizar en cualquier momento.
• El ID del proyecto debe ser único en todos los proyectos de Google Cloud y es inmutable (no se puede cambiar después de configurarlo). Cloud Console genera automáticamente una string única, que, por lo general, no importa cuál sea. En la mayoría de los codelabs, debes hacer referencia al ID del proyecto (suele ser PROJECT_ID). Por lo tanto, si no te gusta, genera otro aleatorio o prueba con uno propio y comprueba si está disponible. Después de crear el proyecto, este ID se “congela” y no se puede cambiar.
• Además, hay un tercer valor, el Número de proyecto, que usan algunas API. Obtén más información sobre estos tres valores en la documentación.

Precaución: El ID de un proyecto debe ser único a nivel global y ninguna otra persona puede usarlo después de seleccionarlo. Eres el único usuario de ese ID, por lo que, si se borra un proyecto, ese ID no se puede volver a utilizar.

Nota: Si usas una cuenta de Gmail, puedes configurar la ubicación predeterminada como Sin organización. Si usas una cuenta de Google Workspace, elige una ubicación adecuada para tu organización.

2. A continuación, deberás habilitar la facturación en Cloud Console para usar las API o los recursos de Cloud. Ejecutar este codelab no debería costar mucho, tal vez nada. Si quieres cerrar los recursos para no se te facture más allá de este instructivo, sigue las instrucciones de “limpieza” que se encuentran al final del codelab. Los usuarios nuevos de Google Cloud son aptos para participar en el programa Prueba gratuita de USD 300.

Inicia el editor de Cloud Shell

Este lab se diseñó y probó para usarse con el editor de Google Cloud Shell. Para acceder al editor,

1. accede a tu proyecto de Google en https://console.cloud.google.com.
2. En la esquina superior derecha, haz clic en el ícono del editor de Cloud Shell.

3. Se abrirá un panel nuevo en la parte inferior de la ventana.
4. Haz clic en el botón Abrir editor.

5. El editor se abrirá con un explorador a la derecha y un editor en el área central.
6. También debería haber un panel de terminal disponible en la parte inferior de la pantalla.
7. Si la terminal NO está abierta, usa la combinación de teclas “ctrl+” para abrir una nueva ventana de terminal.

Configura gcloud

En Cloud Shell, configura el ID del proyecto y la región en la que quieres implementar la aplicación. Guárdalos como variables PROJECT_ID y REGION.

export PROJECT_ID=$(gcloud config get-value project)
export PROJECT_NUMBER=$(gcloud projects describe $PROJECT_ID --format='value(projectNumber)')

Configura el clúster y la base de datos de GKE

1. Descarga la secuencia de comandos de configuración y haz que sea ejecutable.

wget https://raw.githubusercontent.com/GoogleCloudPlatform/container-developer-workshop/main/labs/nodejs/setup.sh
chmod +x setup.sh

Aprovisiona la infraestructura que se usa en este lab

En este lab, implementarás código en GKE y accederás a los datos almacenados en una base de datos de Spanner. La siguiente secuencia de comandos de configuración prepara esta infraestructura por ti.

1. Abre el archivo setup.sh y edita los valores de las contraseñas que actualmente están configuradas como CHANGEME
2. Ejecuta la secuencia de comandos de configuración para preparar un clúster de GKE y una base de datos de Cloud SQL que usarás en este lab

./setup.sh

3. En Cloud Shell, crea un directorio nuevo con el nombre mynodejsapp.

mkdir mynodejsapp

4. Cambia a este directorio y ábrelo como un lugar de trabajo. Esta acción volverá a cargar el editor creando una configuración de lugar de trabajo en la carpeta recién creada.

cd mynodejsapp && cloudshell workspace .

5. Instalar Node y NPM con NVM

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
        
        # This loads nvm bash_completion
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  

nvm install stable

nvm alias default stable

3. Crea una aplicación inicial nueva

1. Inicializa la aplicación

Crea un archivo package.json mediante la ejecución del siguiente comando

npm init

    Choose the entry point: (index.js) src/index.js and default values for the rest of the parameters. This will create the file with following contents

{
  "name": "mynodejsapp",
  "version": "1.0.0",
  "description": "",
  "main": "src/index.js",,
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

2. Agrega un punto de entrada

Edita este archivo para incluir el comando de inicio en la secuencia de comandos "start": "node src/index.js",. Después del cambio, las secuencias de comandos deberían verse como el siguiente fragmento de código:

"scripts": {
    "start": "node src/index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

3. Agrega la dependencia de Express

El código que agregaremos también usa express, así que vamos a agregar esa dependencia a este archivo package.json. Por lo tanto, después de todos los cambios, el archivo package.json debería verse como se muestra a continuación.

​​{
  "name": "mynodejsapp",
  "version": "1.0.0",
  "description": "",
  "main": "src/index.js",
  "scripts": {
    "start": "node src/index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Your Name",
  "license": "ISC",
  "dependencies": {
    "express": "^4.16.4"
  }
}

4. Crea el archivo index.js

Crea un directorio del código fuente llamado src

Crea src/index.js con el siguiente código

const express = require('express');
const app = express();
const PORT = 8080;

app.get('/', (req, res) => {
    var message="Greetings from Node";
    res.send({ message: message });
  });

app.listen(PORT, () => {
  console.log(`Server running at: http://localhost:${PORT}/`);

});

Ten en cuenta que PORT está configurado en el valor 8080

Generar manifiestos

Skaffold proporciona herramientas integradas para simplificar el desarrollo de contenedores. En este paso, inicializarás Skaffold, que creará automáticamente archivos YAML base para Kubernetes. Ejecuta el siguiente comando para comenzar el proceso.

Ejecuta el siguiente comando en la terminal

skaffold init --generate-manifests

Realice las siguientes acciones cuando se le solicite:

• Ingresa 8080 para el puerto
• Ingresa y para guardar la configuración.

Se agregan dos archivos a la visualización del espacio de trabajo: skaffold.yaml y deployment.yaml

Actualiza el nombre de la app

Los valores predeterminados incluidos en la configuración actualmente no coinciden con el nombre de tu aplicación. Actualiza los archivos para hacer referencia al nombre de tu aplicación en lugar de los valores predeterminados.

1. Cambia las entradas en la configuración de Skaffold

• Abrir skaffold.yaml
• Selecciona el nombre de la imagen establecido actualmente como package-json-image
• Haz clic con el botón derecho y elige Cambiar todos los casos.
• Escribe el nombre nuevo como mynodejsapp.

2. Cambia las entradas en la configuración de Kubernetes

• Abrir archivo deployment.yaml
• Selecciona el nombre de la imagen establecido actualmente como package-json-image
• Haz clic con el botón derecho y elige Cambiar todos los casos.
• Escribe el nombre nuevo como mynodejsapp.

Ten en cuenta que, en el archivo skaffold.yaml, la sección build usa buildpacks para alojar la aplicación en contenedores. Este código no tiene un Dockerfile y el desarrollador no necesita ningún conocimiento de Docker para organizar esta aplicación en contenedores.

Además, esta configuración de Skaffold habilita automáticamente la sincronización en caliente entre el editor y el contenedor en ejecución. No se requiere ninguna configuración adicional para habilitar la sincronización en caliente.

4. Explicación del proceso de desarrollo

En esta sección, recorrerás algunos pasos con el complemento de Cloud Code para aprender los procesos básicos y validar la configuración de tu aplicación inicial.

Cloud Code se integra en Skaffold para optimizar tu proceso de desarrollo. Cuando sigas estos pasos para implementar en GKE, Cloud Code y Skaffold compilarán automáticamente tu imagen de contenedor, la enviarán a Container Registry y, luego, implementarán tu aplicación en GKE. Esto sucede detrás de escena, abstrae los detalles del flujo del desarrollador. Cloud Code también mejora tu proceso de desarrollo, ya que proporciona capacidades tradicionales de depuración y hotsync al desarrollo basado en contenedores.

Implementar en Kubernetes

1. En el panel ubicado en la parte inferior del editor de Cloud Shell, selecciona Cloud Code pago.

2. En el panel que aparece en la parte superior, selecciona Ejecutar en Kubernetes. Si se te solicita, selecciona Sí para usar el contexto actual de Kubernetes.

3. La primera vez que ejecutes el comando, aparecerá un mensaje en la parte superior de la pantalla en el que se te preguntará si quieres conocer el contexto de Kubernetes actual. Selecciona “Yes” aceptar y usar el contexto actual.

4. A continuación, se mostrará un mensaje en el que se te preguntará qué registro de contenedores usar. Presiona Intro para aceptar el valor predeterminado proporcionado

5. Selecciona la pestaña Salida en el panel inferior para ver el progreso y las notificaciones.

6. Selecciona “Kubernetes: Run/Debug - Detail”. En el menú desplegable de canales que se encuentra a la derecha para ver detalles adicionales y registros que se transmiten en vivo desde los contenedores

7. Para volver a la vista simplificada, selecciona "Kubernetes: Run/Debug" en el menú desplegable.
8. Cuando finalice la compilación y las pruebas, la pestaña Salida indicará Resource deployment/mynodejsapp status completed successfully y aparecerá una URL: “URL reenviada de service demo-app: http://localhost:8080”.
9. En la terminal de Cloud Code, coloca el cursor sobre la URL en el resultado (http://localhost:8080) y, luego, en la sugerencia de herramientas que aparece, selecciona Abrir vista previa web.

La respuesta será la siguiente:

{"message":"Greetings from Node"}

Recarga en caliente

1. Navega a src/index.js. Edita el código del mensaje de saludo a 'Hello from Node'

Observa inmediatamente que en la ventana Output, en la vista Kubernetes: Run/Debug, el observador sincroniza los archivos actualizados con el contenedor en Kubernetes.

Update initiated
File sync started for 1 files for gcr.io/myproject/mynodejsapp:latest@sha256:f554756b3b4d6c301c4b26ef96102227cfa2833270db56241248ae42baa1971a
File sync succeeded for 1 files for gcr.io/myproject/mynodejsapp:latest@sha256:f554756b3b4d6c301c4b26ef96102227cfa2833270db56241248ae42baa1971a
Update succeeded

2. Si cambias a la vista Kubernetes: Run/Debug - Detailed, notarás que reconoce los cambios en el archivo y reinicia el nodo

files modified: [src/index.js]
Copying files:map[src/index.js:[/workspace/src/index.js]]togcr.io/myproject/mynodejsapp:latest@sha256:f554756b3b4d6c301c4b26ef96102227cfa2833270db56241248ae42baa1971a
Syncing 1 files for gcr.io/myproject/mynodejsapp:latest@sha256:f554756b3b4d6c301c4b26ef96102227cfa2833270db56241248ae42baa1971a
Watching for changes...
[mynodejsapp]
[mynodejsapp]> mynodejsapp@1.0.0 start /workspace
[mynodejsapp]> node src/index.js
[mynodejsapp]
[mynodejsapp]Server running at: http://localhost:8080/

3. Actualiza el navegador para ver los resultados actualizados.

Depuración

1. Ve a la vista de depuración y detén el subproceso actual .
2. Haz clic en Cloud Code en el menú inferior y selecciona Debug on Kubernetes para ejecutar la aplicación en modo debug.

• En la vista Kubernetes Run/Debug - Detailed de la ventana Output, observa que Skaffold implementará esta aplicación en modo de depuración.
• La aplicación tardará algunos minutos en compilarse e implementarse. Esta vez, verás un depurador adjunto.

Port forwarding pod/mynodejsapp-6bbcf847cd-vqr6v in namespace default, remote port 9229 -> http://127.0.0.1:9229
[mynodejsapp]Debugger attached.

3. La barra de estado inferior cambia de color de azul a naranja, lo que indica que está en modo de depuración.
4. En la vista Kubernetes Run/Debug, observa que se inicia un contenedor Debuggable.

**************URLs*****************
Forwarded URL from service mynodejsapp-service: http://localhost:8080
Debuggable container started pod/mynodejsapp-deployment-6bc7598798-xl9kj:mynodejsapp (default)
Update succeeded
***********************************

Utiliza puntos de interrupción

1. Abrir src/index.js
2. Busca la sentencia que dice var message="Greetings from Node";.
3. Para agregar un punto de interrupción a esa línea, haz clic en el espacio en blanco a la izquierda del número de línea. Se mostrará un indicador rojo para indicar que se estableció el punto de interrupción
4. Vuelve a cargar el navegador y observa que el depurador detiene el proceso en el punto de interrupción y te permite investigar las variables y el estado de la aplicación que se ejecuta de forma remota en GKE.
5. Haz clic en la sección de variables hasta que encuentres la variable "message".
6. Para ejecutar la línea, presiona Step over
7. Observa que el valor actual de la variable "message" cambia a "Greetings from Node"
8. Haz doble clic en el nombre de variable "target" En la ventana emergente, cambia el valor a uno diferente, como "Hello from Node".
9. Haz clic en el botón Continuar en el panel de control de depuración.
10. Revisa la respuesta en tu navegador, que ahora muestra el valor actualizado que acabas de ingresar.
11. Cómo detener la "depuración" si presionas el botón de detención y, para quitar el punto de interrupción, vuelves a hacer clic en él.

5. Desarrollar un servicio de REST de CRUD simple

En este punto, tu aplicación está completamente configurada para el desarrollo en contenedores, y ya recorriste el flujo de trabajo básico de desarrollo con Cloud Code. En las siguientes secciones, pondrás en práctica lo que aprendiste agregando extremos del servicio de REST conectados a una base de datos administrada en Google Cloud.

Configura dependencias

El código de la aplicación usa una base de datos para conservar los datos del servicio de REST. Asegúrate de que las dependencias estén disponibles agregando lo siguiente en el archivo package.json.

1. Agrega dos dependencias más, pg y sequelize, al archivo package.json para compilar una aplicación de CRUD en Postgres. Publicar cambios, la sección de dependencias se verá de la siguiente manera.

    "dependencies": {
    "express": "^4.16.4",
    "pg": "^8.7.3",
    "sequelize": "^6.17.0"
  }

Codificar el servicio de REST

1. Agrega el código de la aplicación CRUD a esta aplicación

wget -O app.zip https://github.com/GoogleCloudPlatform/container-developer-workshop/raw/main/labs/nodejs/app.zip

unzip app.zip

Este código tiene

• Carpeta models con el modelo de entidad para item
• La carpeta controllers con el código que realiza las operaciones de CRUD
• La carpeta routes que enruta patrones de URL específicos a diferentes llamadas
• La carpeta config con los detalles de conectividad de la base de datos

2. Ten en cuenta que la configuración de la base de datos en el archivo db.config.js se refiere a las variables de entorno que se deben proporcionar para conectarse a la base de datos. También debes analizar la solicitud entrante para codificar URL.
3. Agrega el siguiente fragmento de código a src/index.js para poder conectarte al código CRUD de tu archivo JavaScript principal justo antes de la última sección que comienza con app.listen(PORT, () => {

const bodyParser = require('body-parser')
app.use(bodyParser.json())
app.use(
 bodyParser.urlencoded({
   extended: true,
 })
)
const db = require("../app/models");
db.sequelize.sync();
require("../app/routes/item.routes")(app);

4. Edita la implementación en el archivo deployment.yaml para agregar las variables de entorno y proporcionar información de conectividad de la base de datos.

Actualiza la entrada de especificaciones al final del archivo para que coincida con la siguiente definición

    spec:
      containers:
      - name: mynodejsapp
        image: mynodejsapp
        env:
        - name: DB_HOST
          value: ${DB_INSTANCE_IP}        
        - name: DB_PORT
          value: "5432"  
        - name: DB_USER
          valueFrom:
            secretKeyRef:
              name: gke-cloud-sql-secrets
              key: username
        - name: DB_PASS
          valueFrom:
            secretKeyRef:
              name: gke-cloud-sql-secrets
              key: password
        - name: DB_NAME
          valueFrom:
            secretKeyRef:
              name: gke-cloud-sql-secrets
              key: database

5. Reemplaza el valor DB_HOST por la dirección de tu base de datos.

export DB_INSTANCE_IP=$(gcloud sql instances describe mytest-instance \
    --format=json | jq \
    --raw-output ".ipAddresses[].ipAddress")

envsubst < deployment.yaml > deployment.new && mv deployment.new deployment.yaml

Implementa y valida la aplicación

1. En el panel ubicado en la parte inferior del Editor de Cloud Shell, selecciona Cloud Code y, luego, elige Debug on Kubernetes en la parte superior de la pantalla.
2. Cuando se completen la compilación y las pruebas, la pestaña Salida indicará Resource deployment/mynodejsapp status completed successfully y aparecerá la URL "URL reenviada desde el servicio mynodejsapp: http://localhost:8080"
3. Agrega algunos elementos.

En la terminal de cloudshell, ejecuta los siguientes comandos

URL=localhost:8080
curl -X POST $URL/items -d '{"itemName":"Body Spray", "itemPrice":3.2}' -H "Content-Type: application/json"
curl -X POST $URL/items -d '{"itemName":"Nail Cutter", "itemPrice":2.5}' -H "Content-Type: application/json"

4. Ejecuta $URL/items en el navegador para probar GET. También puedes ejecutar curl desde la línea de comandos

curl -X GET $URL/items

5. Prueba de eliminación: Ahora intenta borrar un elemento mediante la ejecución. Si es necesario, cambia el valor de item-id.

curl -X DELETE $URL/items/1

    This throws an error message

{"message":"Could not delete Item with id=[object Object]"}

Identifica y soluciona el problema

1. Reinicia la aplicación en modo de depuración y busca el problema. A continuación, se incluyen algunas sugerencias:

• Sabemos que hay un problema con DELETE, ya que no muestra el resultado deseado. Por lo tanto, debes establecer el punto de interrupción en el método itemcontroller.js->exports.delete.
• Realiza la ejecución paso a paso y observa las variables en cada paso para observar los valores de las variables locales en la ventana de la izquierda.
• Para observar valores específicos, como request.params, agrega esta variable a la ventana Watch.

2. Ten en cuenta que el valor asignado a id es undefined. Cámbialo para solucionar el problema.

El fragmento de código fijo se vería así.

// Delete a Item with the specified id in the request
exports.delete = (req, res) => {
    const id = req.params.id;

3. Una vez que se reinicie la aplicación, intenta borrarla nuevamente.
4. Para detener la sesión de depuración, haz clic en el cuadrado rojo de la barra de herramientas de depuración

6. Limpieza

¡Felicitaciones! En este lab, creaste una nueva aplicación de Nodejs desde cero y la configuraste para que funcione en modo de implementación en caliente con contenedores. Luego, implementaste y depuraste tu aplicación en un clúster de GKE remoto con el mismo flujo de desarrollador que se encuentra en las pilas de aplicaciones tradicionales.

Sigue estos pasos para realizar una limpieza después de completar el lab:

1. Borra los archivos utilizados en el lab

cd ~ && rm -rf mynodejsapp && rm -f setup.sh

2. Borra el proyecto para quitar toda la infraestructura y los recursos relacionados.