Add devcontainer configuration and update Azure VM scripts with dynamic DNS labels

Author: 0GiS0

.devcontainer/devcontainer.json

@@ -0,0 +1,32 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/ubuntu
+{
+	"name": "Lemoncode Dev Environment",
+	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+	"image": "mcr.microsoft.com/devcontainers/base:jammy",
+	"features": {
+		"ghcr.io/devcontainers/features/azure-cli:1": {}
+	},
+	"customizations": {
+		"vscode": {
+			"extensions": [
+				"humao.rest-client"
+			]
+		}
+	}
+
+	// Features to add to the dev container. More info: https://containers.dev/features.
+	// "features": {},
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	// "forwardPorts": [],
+
+	// Use 'postCreateCommand' to run commands after the container is created.
+	// "postCreateCommand": "uname -a",
+
+	// Configure tool-specific properties.
+	// "customizations": {},
+
+	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
+	// "remoteUser": "root"
+}

04-cloud/azure/iaas/02-api-vm/README.md

@@ -5,6 +5,7 @@ Para esta pieza de la arquitectura de Tour of Heroes vamos a usar una máquina v
 ```bash
 # API VM on Azure
 API_VM_NAME="api-vm"
+API_VM_DNS_LABEL="tour-of-heroes-api-vm-$RANDOM"
 API_VM_IMAGE="Ubuntu2204"
 API_VM_ADMIN_USERNAME="apiadmin"
 API_VM_ADMIN_PASSWORD="Api@dmin-1232"
@@ -16,6 +17,7 @@ o si estás en Windows:
 ```pwsh
 # API VM on Azure
 $API_VM_NAME="api-vm"
+$API_VM_DNS_LABEL="tour-of-heroes-api-vm-$RANDOM"
 $API_VM_IMAGE="Ubuntu2204"
 $API_VM_ADMIN_USERNAME="apiadmin"
 $API_VM_ADMIN_PASSWORD="Api@dmin1232!"
@@ -35,11 +37,11 @@ FQDN_API_VM=$(az vm create \
 --admin-password $API_VM_ADMIN_PASSWORD \
 --vnet-name $VNET_NAME \
 --subnet $API_SUBNET_NAME \
---public-ip-address-dns-name tour-of-heroes-api-vm \
+--public-ip-address-dns-name $API_VM_DNS_LABEL \
 --nsg $API_VM_NSG_NAME \
 --size $VM_SIZE --query "fqdns" -o tsv)
 
-echo -e "Api VM created"
+echo -e "API VM created"
 ```
 
 o si estás en Windows:
@@ -55,7 +57,7 @@ $FQDN_API_VM=az vm create `
 --admin-password $API_VM_ADMIN_PASSWORD `
 --vnet-name $VNET_NAME `
 --subnet $API_SUBNET_NAME `
---public-ip-address-dns-name tour-of-heroes-api-vm `
+--public-ip-address-dns-name $API_VM_DNS_LABEL `
 --nsg $API_VM_NSG_NAME `
 --size $VM_SIZE --query "fqdns" -o tsv
 
@@ -119,8 +121,16 @@ az network nsg rule create `
 
 Si instalas la extensión REST Client en tu Visual Studio Code, puedes ejecutar la peticiones que aparecen el fichero [api.http](04-cloud/azure/iaas/02-api-vm/api.http).
 
-Para comprobar que la API funciona correctamente podemos acceder a la URL http://tour-of-heroes-api-vm.uksouth.cloudapp.azure.com/api/hero, en este ejemplo (en tu despliegue deberías modificarla por la que corresponda) y deberías ver un listado de héroes en formato JSON.
+Para comprobar que la API funciona correctamente podemos acceder a la URL:
+
+```bash
+echo "http://$API_VM_DNS_LABEL.$LOCATION.cloudapp.azure.com/api/hero"
+ ```
+
+En este ejemplo (en tu despliegue deberías modificarla por la que corresponda) y deberías ver un listado de héroes en formato JSON.
 
 El resultado hasta ahora debería ser el siguiente:
 
-![VM para la API](/04-cloud/azure/iaas/images/api-vm-y-db-vm.png)
+![VM para la API](/04-cloud/azure/iaas/images/api-vm-y-db-vm.png)
+
+Y con esto ya tendríamos la API desplegada en una máquina virtual de Azure. Ahora vamos a desplegar el frontend en otra máquina virtual de Azure. Puedes continuar en el siguiente [paso](../03-frontend-vm/README.md).

04-cloud/azure/iaas/02-api-vm/api.http

@@ -1,4 +1,5 @@
-@base_url = http://tour-of-heroes-api-vm.uksouth.cloudapp.azure.com/api/hero
+#@base_url = http://tour-of-heroes-api-vm-<TU_NUMERO_RANDOM>.uksouth.cloudapp.azure.com/api/hero
+@base_url = http://tour-of-heroes-api-vm-6203.uksouth.cloudapp.azure.com/api/hero
 
 GET {{base_url}} HTTP/1.1
 

04-cloud/azure/iaas/03-frontend-vm/README.md

@@ -1,9 +1,11 @@
 # Crear una máquina virtual para el frontend en Angular
+
 Ahora vamos a crear la máquina virtual para el frontend. Para ello, vamos a necesitar las siguientes variables de entorno:
 
 ```bash
 # Frontend VM on Azure
 FRONTEND_VM_NAME="frontend-vm"
+FRONTEND_DNS_LABEL="tour-of-heroes-frontend-vm-$RANDOM"
 FRONTEND_VM_IMAGE="MicrosoftWindowsServer:WindowsServer:2022-Datacenter:latest"
 FRONTEND_VM_ADMIN_USERNAME="frontendadmin"
 FRONTEND_VM_ADMIN_PASSWORD="fr0nt#nd@dmin123"
@@ -34,7 +36,7 @@ FQDN_FRONTEND_VM=$(az vm create \
 --admin-password $FRONTEND_VM_ADMIN_PASSWORD \
 --vnet-name $VNET_NAME \
 --subnet $FRONTEND_SUBNET_NAME \
---public-ip-address-dns-name tour-of-heroes-frontend-vm \
+--public-ip-address-dns-name $FRONTEND_DNS_LABEL \
 --nsg $FRONTEND_VM_NSG_NAME \
 --size $VM_SIZE --query "fqdns" -o tsv)
 ```
@@ -52,7 +54,7 @@ $FQDN_FRONTEND_VM=az vm create `
 --admin-password $FRONTEND_VM_ADMIN_PASSWORD `
 --vnet-name $VNET_NAME `
 --subnet $FRONTEND_SUBNET_NAME `
---public-ip-address-dns-name tour-of-heroes-frontend-vm `
+--public-ip-address-dns-name $FRONTEND_DNS_LABEL `
 --nsg $FRONTEND_VM_NSG_NAME `
 --size $VM_SIZE --query "fqdns" -o tsv
 ```
@@ -82,7 +84,7 @@ az vm run-command invoke `
 --parameters "api_url=http://$FQDN_API_VM/api/hero" "release_url=https://github.com/0GiS0/tour-of-heroes-angular/releases/download/1.1.4/dist.zip"
 ```
 
-En este ejemplo he desplegado la aplicación en otro puerto, en el 8080, para que no haya conflicto con el IIS que se instala por defecto en el puerto 80. Para elloutilizamos el script [install-tour-of-heroes-angular.ps1](04-cloud/azure/iaas/scripts/install-tour-of-heroes-angular.ps1) que se encuentra en la carpeta **scripts** de este repositorio.
+En este ejemplo he desplegado la aplicación en otro puerto, en el 8080, para que no haya conflicto con el IIS que se instala por defecto en el puerto 80. Para ello utilizamos el script [install-tour-of-heroes-angular.ps1](04-cloud/azure/iaas/scripts/install-tour-of-heroes-angular.ps1) que se encuentra en la carpeta **scripts** de este repositorio.
 
 Lo último que nos queda es habilitar los puertos 80 y 8080 en el NSG de la máquina virtual del frontend:
 
@@ -128,7 +130,13 @@ az network nsg rule create `
 --direction Inbound
 ```
 
-Para probar que todo funciona, abre un navegador y accede a la dirección [http://tour-of-heroes-frontend-vm.uksouth.cloudapp.azure.com:8080](http://tour-of-heroes-frontend-vm.uksouth.cloudapp.azure.com:8080) y deberías ver la aplicación Angular funcionando.
+Para probar que todo funciona, abre un navegador y accede a la dirección:
+
+```bash
+echo http://$FRONTEND_DNS_LABEL.$LOCATION.cloudapp.azure.com:8080
+```
+
+y deberías ver la aplicación Angular funcionando.
 
 Ahora la arquitectura de nuestra aplicación en Azure debería ser la siguiente:
 

04-cloud/azure/iaas/04-load-balancer/README.md

@@ -12,7 +12,7 @@ En este caso, vamos a utilizar un balanceador de carga público para poder acced
 
 ```bash	
 LOAD_BALANCER_NAME="frontend-lb"
-LB_IP_NAME="tour-of-heroes-lb-ip"
+LB_IP_NAME="tour-of-heroes-lb-ip-$RANDOM"
 PROBE_NAME="frontend-probe"
 BACKEND_POOL_NAME="tour-of-heroes-backend-pool"
 ````
@@ -197,7 +197,7 @@ echo -e "Try to access the front end VM using the public IP address of the load
 
 FRONTEND_LB_PUBLIC_IP=$(az network public-ip show \
 --resource-group $RESOURCE_GROUP \
---name $PUBLIC_IP_NAME \
+--name $LB_IP_NAME \
 --query ipAddress \
 --output tsv)
 
@@ -231,7 +231,7 @@ FQDN_FRONTEND_VM_2=$(az vm create \
 --admin-password $FRONTEND_VM_ADMIN_PASSWORD \
 --vnet-name $VNET_NAME \
 --subnet $FRONTEND_SUBNET_NAME \
---public-ip-address-dns-name tour-of-heroes-frontend-vm \
+--public-ip-address-dns-name $FRONTEND_DNS_LABEL-2 \
 --nsg "${FRONTEND_VM_NSG_NAME}-2" \
 --size $VM_SIZE --query "fqdns" -o tsv)
 

04-cloud/azure/iaas/README.md

@@ -20,7 +20,7 @@ RESOURCE_GROUP="tour-of-heroes-on-vms"
 LOCATION="uksouth"
 VM_SIZE="Standard_B2s"
 
-STORAGE_ACCOUNT_NAME="tourofheroesbackups"
+STORAGE_ACCOUNT_NAME="tourofheroesbackups$RANDOM"
 ```
 
 o si estás en Windows: