GCP — Deploying Angular App With Java Backend on GKE
GKE is Google’s managed Kubernetes solution that lets you run and manage containerized applications in the cloud. Since this is a managed Kubernetes service, you can start quickly with single-click clusters, leverage a high-availability control plane including multi-zonal and regional clusters, eliminate operational overhead with auto-repair, auto-upgrade, and release channels, secure by default, including vulnerability scanning of container images and data encryption, integrated Cloud Monitoring with infrastructure, application, and Kubernetes-specific views
In this post, we are going to deploy an Angular application with a Java environment. First, we dockerize our app and push that image to the Google container registry and run that app on Google GKE. We will see how we can build the Kubernetes cluster on Google GKE, Accessing clusters from outside, configuring kubectl to work with the GKE cluster, and many more.
- Example Project
- Install gcloud CLI and Configure
- Dockerize the Project
- Pushing Docker Image To Container Registry
- Creating GKE Cluster
- Configure Kuebctl With GKE Cluster
- Deploy Kubernetes Objects on GKE Cluster
- Access the WebApp from the browser
This is a simple project which demonstrates developing and running Angular application with Java. We have a simple app in which we can add users, count, and display them at the side, and retrieve them whenever you want.
If you want to practice your own here is a Github link to this project. You can clone it and run it on your machine as well.
// clone the repo
git clone https://github.com/bbachi/angular-java-gke.git// Run Angular on port 4200
npm start// Run Java Code on 8080
mvn clean install
java -jar target/users-0.0.1-SNAPSHOT.jar
- If you are new to Angular please go through the below link on how to develop and build the Angular project with Java backend.
The other prerequisites to this post are Docker essentials and Kubernests essentials. We are not going to discuss the basics such as what is a container or what is Kubernetes, rather, we will see how to build a Kubernetes cluster on GCP GKE. Below are the prerequisites you should know before going through this article
You need to understand Docker concepts such as creating images, container management, etc. Below are some of the links that you can understand about Docker if you are new.
- Docker Docs
- Docker — A Beginner’s guide to Dockerfile with a sample project
- Docker — Image creation and Management
- Docker — Container Management With Examples
- Understanding Docker Volumes with an example
You need to understand Kubernetes’ essentials as well along with Docker essentials. Here are some of the docs to help you understand the concepts of Kubernetes.
- Create a New project
- You need to create a Billing Account
- Link Billing Account With this project
- Enable All the APIs that we need to run the dataflow on GCP
- Download the Google SDK
Need to create a service account so that when you run the application from your local machine it can invoke the GCP dataflow pipeline with owner permissions.
You have to generate the key and download and set the environment variable called GOOGLE_APPLICATION_CREDENTIALS.
Finally, you can run the following command to log in to your GCP account.
gcloud auth login
Install gcloud CLI and Configure
Once you have the GCP Account you can install the gcloud command-line tool. You can go to the below documentation and install gcloud CLI based on your operation system. You can configure gcloud CLI with your project.
gcloud init// auth login
gcloud auth login
Once you run the above command, it opens up a browser for you to login into your GCP and you get the response as below.
You can list the projects with the following command.
gcloud projects list
You can set the current project with the following command.
gcloud config set project staticweb-test
Dockerize the Project
Google GKE is a managed service that makes it easy for you to run Kubernetes on the Google Cloud Platform. The first thing you need to do is to dockerize your project.
Here is the Dockerfile and it is using OpenJDK as a base image.
If you want to know the whole process of creating a Docker image for this project, please check the below link.
Here are the commands to build the image and run it on the Docker engine on your local machine.
// build the image
docker build -t java-angular .// run the container
docker run -d -p 8080:8080 --name javaangular java-angular// list the container
docker ps// logs
docker logs javaangular
Pushing Docker Image To Container Registry
Container Registry is a single place for your team to manage Docker images, perform vulnerability analysis, and decide who can access what with fine-grained access control. Existing CI/CD integrations let you set up fully automated Docker pipelines to get fast feedback. You can check the whole documentation here.
GCP GKE works with any Docker registry such as Docker Hub, etc. But, in this post, we see how we can use a GCP container registry to store our Docker images. Make sure you enable the relevant API on GCP. If you log in and go to the Container Registry you can see the empty registry.
The first thing we need to do is to enable the API with the following command.
gcloud services enable containerregistry.googleapis.com
You need to configure docker with the following command. You can see the full documentation here.
gcloud auth configure-docker
As we have seen in the Example Project section, let's build the Docker image with the following command.
docker build -t angular-java .
Let’s tag the local docker image with the registry name by using the command:
docker tag [SOURCE_IMAGE] [HOSTNAME]/[PROJECT-ID]/[IMAGE]:[TAG]// run this command
docker tag angular-java gcr.io/staticweb-test/angular-webapp:v1
Finally, push the image into the GCP container registry
docker push gcr.io/staticweb-test/angular-webapp:v1
You can see the repository in the console as well.
Creating GKE Cluster
We have pushed the Docker image into the container registry and it’s time to create a GKE Cluster. You can create the cluster with the following command.
gcloud container clusters create my-cluster
But, we will see how we can create Cluster through the console. Go to the GKE dashboard in the GCP console. Click the button to create a cluster.
It asks you some basic questions such as location type, version of kubernetes, etc.
Once you click on the create button on the above screen it creates the cluster with three Nodes.
You can click on the cluster and go to the details section where you can see the nodes.
You can list the clusters with the following command.
gcloud container clusters list
Configure Kuebctl With GKE Cluster
Kubectl is the command-line utility for the Kubernetes. You need to install kubectl before you configure it. Click on the connect button on the console so that it gives you a command to configure kubectl with the GKE Cluster.
Just copy the below command and run it on your terminal.
gcloud container clusters get-credentials frontend-cluster --zone us-central1-c --project staticweb-test
Once you run this command, kubectl is configured to use GKE Cluster and you can even get the nodes from the cluster.
Deploy Kubernetes Objects on GKE Cluster
Now we have configured kubectl to use GCP GKE from our own machine. Let’s create deployment and service objects and use the image from the GCP Container Registry.
First, you need to get the repository URL from the details section of Container Registry where our repositor resides.
Here is the manifest file which contains these objects. Notice we are using the same repository from the Container Registry.
If you cloned the above example project and you are at the root folder just use this command to create objects
kubectl create -f manifest.yml
You can use the following commands to verify all the objects are in the desired state.
// list the deployment
kubectl get deploy// list the pods
kubectl get po// list the service
kubectl get svc
We can see 5 pods running since we have defined 5 replicas for the deployment.
Access the WebApp from the browser
We have created a service with the LoadBalancer type. You can get the external IP from the service and access the entire from the browser.
You can access the webapp with the following URL
Delete the Cluster
You can just delete the cluster with the following command. Make sure you delete if you don’t want to incur charges.
gcloud container clusters delete [CLUSTER_NAME]
- GKE is Google’s managed Kubernetes solution that lets you run and manage containerized applications in the cloud.
- Before starting this, you need to have docker and Kubernetes essentials. If you don’t have these essentials please go through these with the links provided.
- You need to create a GCP Account here.
- You need a billing account to be associated with your project so that all the cost is billed to this billing account.
- You can create the GKE cluster through a console, Gcloud CLI, REST API as well.
- You can install gcloud CLI and configure it to use with your GKE Cluster.
- Configure kubectl to use the GKE cluster.
- Create a deployment and service with Loadbalancer so that you can access it from outside.
- You can access the dashboard with either Kubeconfig or Token.
- Make sure you delete if you don’t want to incur charges.
We have deployed a simple Angular application with Java Backend on Google GKE Cluster and access it from the browser. In future posts, we can see more advanced use cases.