This is a sample project to demonstrate how to develop and deploy Spring Boot, React and MongoDB microservice based applications in Docker and Kubernetes environment.
- Java 11
- Maven > 3.2.1
- MongoDB > 4.0
Once MongoDB is installed, start a MongoDB server with below command
cd <mongoDB_installation_dir>\bin
mongod --dbpath mongodb_data
Run the backend app from source
git clone https://github.com/amrityam/spring-boot-reactjs-kubernetes.git
cd spring-boot-reactjs-kubernetes\corona-tracker-backend
# Building
mvn clean install
# Running
mvn clean install spring-boot:run
The app should connect to MongoDB and then listen for requests.
We can access the app on http://localhost:8080
- NodeJS > 0.10.x
git clone https://github.com/amrityam/spring-boot-reactjs-kubernetes.git
cd spring-boot-reactjs-kubernetes\corona-tracker-frontend
# Install NPM packages
npm install
# Running
npm start
Now the frontend react app can be accessed on http://localhost:3000
- Docker
We have to install the Docker Community Edition (CE).
The installation instructions can be followed in the Official Docker documentation.
If you're on Windows, you can follow the handy guide on how to install Docker on Windows.
We are now ready to build Docker containers.
git clone https://github.com/amrityam/spring-boot-reactjs-kubernetes.git
cd spring-boot-reactjs-kubernetes\corona-tracker-backend
# Build Docker image for backend app
docker build -t corona-tracker-backend .
# create a docker network so that backend container can communicate with mongo db container
docker network create corona-tracker-network
# Run the mongoDB container
docker run --name=mongo --rm --network=corona-tracker-network mongo
# Run the spring-boot backend container
docker run --name=corona-tracker-backend --rm --network=corona-tracker-network -p 8080:8080 -e MONGO_URL=mongodb://mongo:27017/corona-tracker corona-tracker-backend
The app should connect to MongoDB and then listen for requests.
We can access the app on http://localhost:8080
git clone https://github.com/amrityam/spring-boot-reactjs-kubernetes.git
cd spring-boot-reactjs-kubernetes\corona-tracker-frontend
# Build Docker image for frontend app
docker build -t corona-tracker-frontend .
# Run the reactjs frontend container
docker run --name corona-tracker-frontend --rm -p 3000:3000 corona-tracker-frontend
Now the frontend react app can be accessed on http://localhost:3000
- Docker : https://docs.docker.com/get-docker/
- kubernetes-cli (kubectl) : https://kubernetes.io/docs/tasks/tools/install-kubectl/
- minikube : https://minikube.sigs.k8s.io/docs/start/
- Virtualbox version 5.2+ ([or other minikube compatible hypervisors][minikube-hypervisors])
OR
As an alternative if you are using Windows/Mac system, you can install docker desktop which provides native kubernetes support.
Install K8 through Docker desktop for Windows: https://birthday.play-with-docker.com/kubernetes-docker-desktop/
Install K8 through Docker desktop for Mac: https://medium.com/backbase/kubernetes-in-local-the-easy-way-f8ef2b98be68
# Clone this repo
git clone https://github.com/amrityam/spring-boot-reactjs-kubernetes.git
cd spring-boot-reactjs-kubernetes
Create a new namespace
kubectl create namespace corona-tracker-app-namespace
Run kubectl apply command to create/update the resources in the Kubenetes cluster.This will execute the yaml files present in the kubernetes folder.
kubectl apply -f kubernetes
As soon as all the 3 Pods are in the Running state, our application is ready.
To check on which ports our backend and frontend apps are running run kubectl get services command.
kubectl get services --namespace corona-tracker-app-namespace
Backend app is running on http://localhost:30353/ and Frontend app is running on http://localhost:30233/
But wait..Why our frontend app is not displaying any data??
The backend api calls from the frontend app is failing because the frontend app tries to access the backend APIs at localhost:8080. Ideally, in a real-world, you’ll have a public domain for your backend server. But since our entire setup is locally installed, we can use kubectl port-forward command to map the localhost:8080 endpoint to the backend service.
kubectl port-forward service/corona-tracker-backend-service 8080:8080 --namespace corona-tracker-app-namespace
That’s it! Now, you’ll be able see the data in the frontend app. Here is how the app looks like.
kubectl scale deployments corona-tracker-backend-deploy --replicas=3 --namespace corona-tracker-app-namespace
If you want to delete the pods, services, deployments then you have to just delete the namespace.
kubectl delete namespace corona-tracker-app-namespace
Distributed under the MIT License. See LICENSE for more information.
Amrityam Rout - @iamrityam - amrityamlive@gmail.com
Project Link: https://github.com/amrityam/spring-boot-reactjs-kubernetes