Desplegando un Backend Graphql NodeJS Azure Container Apps
Tags: azure, containerapps, tutorial, graphql
Published: 2022-10-09 21:42:07

En esta entrada realizaremos el despliegue de un backend utilizando Azure DevOPS (pipelines), Azure Registries y Azure Containers Apps

#Requisitos 
Cuenta en Azure 
Servicio Azure Registries Activo
Servicio Azure Containers Apps Activo 
Cuenta en Azure DevOps 

#Creando servicio Registries 
Partiré de la premisa que ya cuentas con una cuenta en Azure, navegamos en el buscador de servicios y buscamos el Servicio Azure Container Registries

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/77ab1i2kuv8bo4o4s5w0.png)

Una vez dentro, deberás de llenar los campos marcados como obligatorios

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nn4omhj9tuzrlk6ha7fb.png)

Para esta entrada te recomendaré que utilices en SKU: Basic, esto para reducir el gasto en la factura y si tu APP no tiene bastante demanda. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5js6gtp76js7l53n7blw.png)

Al ser un registro básico, este estará público aplicará el mismo caso para el tipo de Encryptation. Si deseas agregar los tags puedes hacerlo para este ejemplo dejaré todo en blanco y saltaré hasta la última pantalla 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k4p8g1f12k1m1sogm4s0.png)

Damos clic en el botón create para crear el recurso. 

#Conectado Azure DevOPS Pipelines con Azure Registries

En esta parte conectaremos nuestro repositorio a Registries a fin de obtener la imagen Docker que posteriormente desplegaremos. 

Ingresamos al apartado pipelines de nuestro Azure DevOPS y crearemos una nueva

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2kqmq04vtrzi29sdmvlj.png)

Seleccionamos Azure Repos Git y posteriormente el proyecto con el que vamos a trabajar. En mi caso es testProject 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gmc836o6d9dcgjbkhbx4.png)

A continuación nos aparecerán las opciones disponibles, para esta entrada seleccionaremos la segunda opción de Docker (Build and Push and Image to Azure Container Registry)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yjv5i1fxijrnypvdhmag.png)

Ahora seleccionamos la subscripción en la que desplegaremos el contenedor. 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ku52bwhhsud8e2qrix24.png)

En la siguiente pantalla vamos a validar a que registro enviaremos la imagen, así como también el nombre que llevará la imagen. Para este caso dejaré todo como aparece en el asistente y hacemos clic en el Validate and Configure 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8b3njh9ekcn6qbrkfxyk.png)

En la siguiente pantalla nos aparecerá la pantalla del archivo de configuración del pipeline ya finalizado. Hacemos clic en Save and Run, damos commit y esperamos a que se ejecute el pipeline

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zd2fk424z1wcn7btqa5c.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hehovntwqo4rsjtrbejw.png)

Una vez que finalizó nuestro Pipeline, procedos a regresar al Registries. En el apartado Repositories podemos observar nuestra imagen desplegada. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b63c3hykbn1w3wjdpx8u.png)

#Desplegando el contenedor a Azure Container App

Para este apartado crearemos un nuevo recurso de tipo Azure Container App. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4dwnxs4it3tf0g5kd0hb.png)

Una vez creado el recurso, ingresamos y buscamos el apartado Containers. Probablemente tengamos el contenedor "hello-world", esto porque me he bricando un paso cuando estaba creando el recurso


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s1korzg6konzutrscmz8.png)

Hacemos clic en Edit 

Nos aperecerá la siguiente ventana donde eliminaremos el contenedor de ejemplo

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z8grqunjc1buquxmts7m.png)

Hacemos clic en el botón Add (+) y nos aparecerá un cuadro de diálogo donde se deberá ingresar la información para conectar el contenedor que acabamos de desplegar en Registries 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o85n4yrsoxnjqaqd0cst.png)

Si nos aparece ese error es porque no tenemos permisos para leer las imagenes del Registro, para ello regresamos al Registro 

En el apartado Access Keys habilitamos la opción Admin user 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1tbtnn7cd4ao4fpnuvow.png)

Te recomiendo guardar para uso futuro el password que aparece.

Una vez realizado esta modificación regresamos al Container Apps y volvemos a agregar el contenedor. 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sxr0agzwsmiw4cu92kcu.png)

Ahora podemos tener acceso al registro y las imagenes de contenedor que este tiene. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8b5dghbbiz7v7mghyl18.png)



Al final tienes un apartado Environment Variables, aquí configuras las variables de entorno de tu App, ejemplo conexión a base de datos, puertos, etc. 

Como este es un simple hola mundo, solo agregaré la variable de entorno PORT, que es la necesaria para que la app pueda funcionar. 

Finalizando las configuraciones hacemos clic en Add

Con esto tendremos nuestra aplicación contenerizada desplegada en Azure Containers App. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u2q9py6hbphh94ex6b6j.png)

Probando el endpoint en Altair Graphql


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jxx1zfruvmupsibd8qs8.png)