Ejercicio: Mejora de la aplicación con configmaps

Completado

Ha implementado el back-end de la aplicación y ahora debe implementar el front-end de la aplicación mediante un objeto ConfigMap.

Antes de empezar

Nota:

Este ejercicio es opcional. Si le interesa completar este ejercicio, deberá crear una suscripción de Azure antes de empezar. Si no tiene una cuenta de Azure o no quiere crear una en este momento, puede leer las instrucciones para comprender la información que se está presentando.

Crea un ConfigMap

1. Cree un nuevo archivo YAML denominado configmap.yaml y pegue el código siguiente para crear la especificación configMap:

   apiVersion: v1
   kind: ConfigMap
   metadata:
     name: ship-manager-config
     namespace: default
   data:
     config.js: |
       const config = (() => {
         return {
           'VUE_APP_BACKEND_BASE_URL': 'http://ship-manager-backend.{your-dns-zone}.aksapp.io',
         }
       })()
   

2. Reemplace {your-dns-zone} por el valor de la variable ZONE_NAME que creó anteriormente.

3. Guarde y cierre el archivo.

4. Aplique los cambios en el clúster mediante el kubectl apply comando .

   kubectl apply -f configmap.yaml
   

5. Para comprobar el resultado, consulte configMap mediante el kubectl get configmap comando .

   kubectl get configmap ship-manager-config
   

Creación de la aplicación

1. Cree un nuevo archivo YAML denominado frontend.yaml y pegue el código siguiente para crear la especificación de implementación:

   apiVersion: apps/v1
   kind: Deployment
   metadata:
     name: contoso-ship-manager-frontend
     namespace: default
   spec:
     replicas: 1
     selector:
       matchLabels:
         app: contoso-ship-manager-frontend
     template:
       metadata:
         labels:
           app: contoso-ship-manager-frontend
       spec:
         containers:
           - image: mcr.microsoft.com/mslearn/samples/contoso-ship-manager:frontend
             name: contoso-ship-manager-frontend
             ports:
               - containerPort: 80
                 name: http
             volumeMounts:
               - name: config
                 mountPath: /usr/src/app/dist/config.js
                 subPath: config.js
         volumes:
           - name: config
             configMap:
               name: ship-manager-config
   ---
   

   Observe cómo se monta ConfigMap en el objeto Deployment. No se especifican claves, lo que significa que es necesario especificar una subPath clave. subpath es el nombre de archivo dentro del contenedor.

2. Debajo de los tres guiones, pegue el siguiente código para crear las especificaciones de Service e Ingress:

   apiVersion: v1
   kind: Service
   metadata:
     name: contoso-ship-manager-frontend
     namespace: default
   spec:
     selector:
       app: contoso-ship-manager-frontend
     ports:
       - name: http
         port: 80
         targetPort: 80
   ---
   apiVersion: networking.k8s.io/v1
   kind: Ingress
   metadata:
     name: contoso-ship-manager-frontend
     namespace: default
     annotations:
       spec.ingressClassName: webapprouting.kubernetes.azure.com
   spec:
     rules:
       - host: contoso-ship-manager.{your-dns-zone}.aksapp.io
         http:
           paths:
             - path: /
               pathType: Prefix
               backend:
                 service:
                   name: contoso-ship-manager-frontend
                   port: 
                     name: http
   

3. Reemplaza {your-dns-zone} en el Ingress por el valor de la variable ZONE_NAME que creó anteriormente.

4. Guarde y cierre el archivo.

5. Implemente la aplicación mediante el comando kubectl apply.

   kubectl apply -f frontend.yaml
   

6. Para comprobar el resultado, consulte la API de Kubernetes mediante el kubectl get deployment comando .

   kubectl get deployment contoso-ship-manager-frontend
   

   Cuando la API esté disponible, debería obtener una salida similar al ejemplo siguiente:

   NAME                           READY   UP-TO-DATE   AVAILABLE   AGE
   contoso-ship-manager-frontend  1/1     1            1           18s