Latihan - Tingkatkan aplikasi dengan configmap

Selesai

Anda menyebarkan back end aplikasi, dan sekarang Anda perlu menyebarkan front end aplikasi menggunakan ConfigMap.

Sebelum kita mulai

Catatan

Latihan ini bersifat opsional. Jika Anda ingin menyelesaikan latihan ini, Anda harus membuat langganan Azure sebelum memulai. Jika Anda tidak memiliki akun Azure atau tidak ingin membuatnya sekarang, Anda dapat membaca petunjuk agar Anda memahami informasi yang sedang diberikan.

Membuat ConfigMap

1. Buat file YAML baru bernama configmap.yaml dan tempelkan dalam kode berikut untuk membuat spesifikasi 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. Ganti {your-dns-zone} dengan nilai variabel ZONE_NAME yang Anda buat sebelumnya.

3. Simpan dan tutup file.

4. Terapkan perubahan pada kluster Anda menggunakan kubectl apply perintah .

   kubectl apply -f configmap.yaml
   

5. Periksa hasilnya dengan mengkueri ConfigMap menggunakan kubectl get configmap perintah .

   kubectl get configmap ship-manager-config
   

Buat aplikasi

1. Buat file YAML baru bernama frontend.yaml dan tempelkan dalam kode berikut untuk membuat spesifikasi Penyebaran:

   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
   ---
   

   Perhatikan bagaimana ConfigMap dipasang di objek Penyebaran. Kami tidak menentukan kunci apa pun, yang berarti kami perlu menentukan subPath kunci. subpath adalah nama file di dalam kontainer.

2. Di bawah tiga tanda hubung, tempelkan kode berikut untuk membuat spesifikasi Layanan dan 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. Ganti {your-dns-zone} di Ingress dengan nilai variabel ZONE_NAME yang Anda buat sebelumnya.

4. Simpan dan tutup file.

5. Sebarkan aplikasi menggunakan kubectl apply perintah .

   kubectl apply -f frontend.yaml
   

6. Periksa hasilnya dengan mengkueri API Kubernetes menggunakan kubectl get deployment perintah .

   kubectl get deployment contoso-ship-manager-frontend
   

   Saat API tersedia, Anda akan mendapatkan output yang mirip dengan contoh berikut:

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