Springboot & Angular full stack application deployment with Docker , AWS EC2, AWS S3, jenkins , Github — PART 1 : Dockerizing spring boot and postgres

Introduction :

Navigating the intricacies of modern software development, especially in the realm of full-stack applications, can be a challenge. As the complexity grows, so does the need for effective deployment and management strategies.

In this article, I’ll guide you through deploying a full-stack application on AWS EC2 and Amazon S3 using Docker and setting up a robust continuous integration and deployment (CI/CD) pipeline with Jenkins.

the article will be divided into 3 easy-to-follow parts as follows :

. Part 1 : The main objective of this section is to dockerize the Angular application and the Spring Boot application, using Docker Compose to manage images.

. Part 2 : The primary focus of this section is to configure Docker in an EC2 environment.

. Part 3 : Deploy Angular App to S3 Bucket and Configure it as a Static Website

. Part 4 : Configure Jenkins in an EC2 Environment, Establish GitHub Connection with Webhooks, and Build CI/CD Pipelines

Without any further talk let’s dive into the article !

prerequisite:

you should have docker engine installed on your machine and you could do so by following the official docs .

Phase 1 : Dockerizing Spring boot application

Dockerfile configurations snippet for our spring boot app : (It vary based on your project’s characteristics ):

FROM openjdk:17-jdk-slim
WORKDIR /app

# Copy the jar file into the container
COPY target/*.jar app.jar

EXPOSE 8080

# Specify the command to run on container start
ENTRYPOINT ["java", "-jar", "app.jar"]

Docker compose file to manage spring boot image and postgres image :

services:
  postgres:
    image: 'postgres:latest'
    environment:
      - POSTGRES_DB=myHR
      - POSTGRES_PASSWORD=1234
      - POSTGRES_USER=postgres
    ports:
      - "5432:5432"
  spring-app:
    build:
      context: .
      dockerfile: Dockerfile
    ports:
      - "8080:8080"
    depends_on:
      - postgres
    environment:
      - SPRING_DATASOURCE_URL=jdbc:postgresql://postgres:5432/myHR
      - SPRING_DATASOURCE_USERNAME=postgres
      - SPRING_DATASOURCE_PASSWORD=1234

After setting configurations run the following command to build and run you’re docker images at once :

docker compose up --build

Phase 2 : Dockerizing angular application :

Docker file configurations snippet for Angular application :

# Fetch node image 
FROM node:20.11.0-alpine

# Set the working directory (Inside the container)
WORKDIR /app

# Copy the package.json and package-lock.json to the container
COPY package*.json ./

# Build angular application 
RUN npm install

# Copy the source code to the container
COPY . .

RUN npm run build 

# Expose the port 4200
EXPOSE 4200

# Start the application
CMD ["npm", "start"] 

After setting configurations build the image using the following command :

docker build -t <tag or name> . 

And now run the container

docker run -p <someport>:<someport> <container name>

You could check if the the container is running either by directly accessing the port from the browsers or by checking running containers using the following command :

docker ps

Conclusion :

This part was mainly focused on dockerizing our full stack application in order to deploy the images later to dockerhub in following articles. feel free to browse them based on you’re interests or to read them one by one in order for learning purposes.

However , In the next part we’re going to create EC2 instances and also configure jenkins and docker in our instances in order to implement CI/CD.

See you in the next part ! :)