In the previous post, we Dockerized the ReactJS App and were able expose it from our Container to our machine to run it in the browser on http://localhost:3000. Now we want our Docker containers to be Orchestrated using Kubernetes.

First, we need to enable Kubernetes from Docker Desktop settings. This will install Kubernetes with Apply and Restart option. Just follow the default options.

Verify the installation with to check Client and Server versions:

>kubectl version

Make sure the context is set to docker-desktop which can also be checked from the docker icon at the top.

>kubectl config current-context

docker-desktop

If the context is different (in case you’re also running MiniKube), we can switch it using:

>kubectl config use-context docker-for-desktop

Switched to context "docker-for-desktop"

Check cluster info:

>kubectl cluster-info

Kubernetes master is running at https://kubernetes.docker.internal:6443
KubeDNS is running at https://kubernetes.docker.internal:6443/api/v1/namespaces/kube-system/services/kube-dns:dns/proxy

Check the pods running in the cluster:

>kubectl get nodes

NAME             STATUS   ROLES    AGE   VERSION
docker-desktop   Ready    master   23h   v1.19.7

Install the Kubernetes Dashboard with:

>kubectl apply -f https://raw.githubusercontent.com/kubernetes/dashboard/v2.0.0-rc3/aio/deploy/recommended.yaml

The Dashboard application will get deployed as a Pod in the kubernetes-dashboard namespace. We can get a list of all our Pods in all namespaces via the following command:

>kubectl get pods --all-namespaces

kubernetes-dashboard   dashboard-metrics-scraper-c95fcf479-8l8vf   1/1     Running   0          23h
kubernetes-dashboard   kubernetes-dashboard-5bc6d86cfd-6b68m       1/1     Running   1          23h

Just check if your kubernetes-dashboard-* pod is in running state. Now, start the local Proxy server to access your Dashboard:

>kubectl proxy

Starting to serve on 127.0.0.1:8001

Once the proxy server is started, you can access the Dashboard at:

http://localhost:8001/api/v1/namespaces/kubernetes-dashboard/services/https:kubernetes-dashboard:/proxy

To Login to the Dashboard, we’ll login using a token. The Token can be generated by running the command:

>kubectl -n kube-system describe secret $(kubectl -n kube-system get secret | awk '/^deployment-controller-token-/{print $1}') | awk '$1=="token:"{print $2}'

Now our basic setup is complete to get Kubernetes running on Mac.

Now we need to get our ReactJS App ready for Deployment on Kubernetes. Create the Deployment and Service manifest to run it on Kubernetes and expose the required port. Create the combined .yml file as below, however these can be created separately as well:

kind: Deployment
apiVersion: apps/v1
metadata:
  name: reactondocker
spec:
  replicas: 2
  selector:
    matchLabels:
      app: reactondocker
  template:
    metadata:
      labels:
        app: reactondocker
    spec:
      containers:
        - name: reactondocker
          image: myimage/reactondocker:latest
          imagePullPolicy: Always
          ports:
            - containerPort: 3000

---

kind: Service
apiVersion: v1
metadata:
  name: reactondocker
spec:
  type: NodePort
  ports:
    - port: 3000
      targetPort: 3000
      protocol: TCP
      nodePort: 30004
  selector:
    app: reactondocker
      

I’m using the NodePort Service to expose it on port 30004. Number of Pods to run is 2.

Note: If you’ve not pushed the image to a registry, then change imagePullPolicy: Never or IfNotPresent so it uses the local image created using Docker on your machine. Also, change the image name accordingly.

Run the below command to create the Deployment and the Service:

>kubectl create -f deployment.yml

deployment.apps/reactondocker created
service/reactondocker created

You can check the Pods running for reactondocker in your Kubernetes dashboard or with the below command:

>kubectl get pods

The status of the Pods should be running. Try accessing the Application in your browser as http://localhost:30004.

Finally, we should delete the ReactJS Application from the Kubernetes cluster:

>kubectl delete service,deployment reactondocker

service "reactondocker" deleted
deployment.apps "reactondocker" deleted