Deploy a Sample Live Angular frontend microservice on Cloud Kubernetes Cluster 2022

 

At first setup nginx ingress on your managed cloud kubernetes cluster

create a helm-install.sh and replace the your-cluster-name here with cluster-name

#src : https://docs.microsoft.com/en-us/azure/aks/ingress-tls

helm repo add ingress-nginx https://kubernetes.github.io/ingress-nginx

# changes context to stage

kubectl config use-context your-cluster-name

# Create a namespace for your ingress resources

kubectl create namespace nginx-ingress

# Use Helm to deploy an NGINX ingress controller

helm upgrade --install ingress-nginx ingress-nginx/ingress-nginx \

--namespace nginx-ingress \

--set controller.replicaCount=3 \

-f internal-ingress-web.yaml \

--set controller.nodeSelector."kubernetes\.io/os"=linux \

--set defaultBackend.nodeSelector."kubernetes\.io/os"=linux

Give it to execute permission

chmod +x ./helm-install.sh

Then create the config yaml named internal-ingress-web.yaml

controller:

config:

use-forwarded-headers: "true"

server-tokens: "False"

client-header-buffer-size: 64k

proxy-buffer-size: 64k

proxy-body-size: 10m

#proxy-read-timeout: "600"

#proxy-send-timeout: "600"

Then run ./helm-install.sh

Check pod, services, and external load balancer ip

kubectl get po -n nginx-ingress

kubectl get svc -n nginx-ingress

Then create the deployment.yaml, service.yaml, and ingress.yaml

deployment.yaml

apiVersion: apps/v1

kind: Deployment

metadata:

name: webclient-angular-crud

spec:

selector:

matchLabels:

app: webclient-angular-crud

replicas: 1

template:

metadata:

labels:

app: webclient-angular-crud

spec:

containers:

- name: webclient-angular-crud

image: shawon10/webclient-angular-crud:85

imagePullPolicy: Always

ports:

- containerPort: 80

service.yaml

apiVersion: v1

kind: Service

metadata:

name: webclient-angular-crud-service

spec:

selector:

app: webclient-angular-crud

ports:

- protocol: "TCP"

port: 80

type: ClusterIP

ingress.yaml

Change the domain here and replace with your own domain

apiVersion: networking.k8s.io/v1

kind: Ingress

metadata:

annotations:

kubernetes.io/ingress.class: nginx

nginx.ingress.kubernetes.io/configuration-snippet: |

more_set_headers "X-Frame-Options: Deny";

more_set_headers "X-Xss-Protection: 1; mode=block";

more_set_headers "X-Content-Type-Options: nosniff";

name: webclient-angular-crud-ingress

spec:

rules:

- host: microservices.devops.com

http:

paths:

- backend:

service:

name: webclient-angular-crud-service

port:

number: 80

path: /

pathType: ImplementationSpecific

Finally apply all

kubectl apply -f .

Check the pods

kubectl get po

Then go to your domain dns management and add A records and point to your nginx ingress Loadbalancer external ip

Finally access the frontend site live....

Check this video for details

Download Coding Interview Book and Get More Tutorials for Coding and Interview Solution: Click Here

Download System Design Interview Book and Get More Tutorials and Interview Solution: Click Here

Do you need more Guidance or Help? Then Book 1:1 Quick Call with Me: Click Here

Share on Google Plus

About Ashadullah Shawon

I am Ashadullah Shawon. I am a Software Engineer. I studied Computer Science and Engineering (CSE) at RUET. I Like To Share Knowledge. Learn More: Click Here