Frontend WebUI also uses the deployment and service, but it exposes the port (TCP port 30080) in order to access it from an external web browser:

$ cat my-frontend.yaml 
apiVersion: apps/v1
kind: Deployment
metadata:
  name: my-frontend-deploy
spec:
  replicas: 2
  selector:
    matchLabels:
      run: my-frontend
  template:
    metadata:
      labels:
        run: my-frontend
    spec:
      containers:
      - name: my-frontend
        image: hidetosaito/my-frontend
---
apiVersion: v1
kind: Service
metadata:
  name: my-frontend-service
spec:
  ports:
    - protocol: TCP
      port: 5000
      nodePort: 30080
  type: NodePort
  selector:
     run: my-frontend


$ kubectl create -f my-frontend.yaml 
deployment.apps "my-frontend-deploy" created
service "my-frontend-service" created

 Let's try to access my-frontend-service using a web browser. You can access any Kubernetes node's IP address; specify the port number 30080. If you are using minikube, simply type minikube service my-frontend-service to access. Then you can see the my-frontend application as follows:

When you click on the addition button, it will forward a parameter to microservices (my-calc). Microservices compute the addition (yes, just an addition!) and then return the result back to the frontend WebUI as follows:

So now, it is easy to scale the pod for the frontend WebUI and microservices independently. For example, scale WebUI pod from 2 to 8 and microservice pod from 2 to 16, as shown:

$ kubectl get deploy
NAME                 DESIRED   CURRENT   UP-TO-DATE   AVAILABLE   AGE
my-calc-deploy       2         2         2            2           30m
my-frontend-deploy   2         2         2            2           28m

$ kubectl scale deploy my-frontend-deploy --replicas=8
deployment "my-frontend-deploy" scaled

$ kubectl scale deploy my-calc-deploy --replicas=16
deployment "my-calc-deploy" scaled

$ kubectl get deploy
NAME                 DESIRED   CURRENT   UP-TO-DATE   AVAILABLE   AGE
my-calc-deploy       16        16        16           16          31m
my-frontend-deploy   8         8         8            8           29m

Also, if there's a need to fix some bugs, for example, if there's a frontend need to validate
the input parameter to check whether it is numeric or a string (yes, if you type string and
then submit, it will show an error!), it will not affect the build and deploy the cycle against
microservices:

In addition, if you want to add another microservice, for example, subtraction microservices, you may need to create another Docker image and deploy with another deployments and service, so it will be independent from the current microservices. Then, you can keep accumulating your own microservice ecosystem to reuse in another application.