Docker Community Forums

Share and learn in the Docker community.

Docker-compose to get letsencrypt ssl for Angular, Spring Boot API with Mysql stack

have a Java Spring API back end connected to a MySql database and an Angular Front end with nginx for proxy.

This config works well with my docker compose and i just copy the files over to my server then docker-compose up and all is working.

my docker-compose file is :

version: '3'
services:
  mysql:
   container_name: some-mysql
   image: mysql/mysql-server:5.7
   environment:
    MYSQL_DATABASE: test
    MYSQL_ROOT_PASSWORD: password
    MYSQL_ROOT_HOST: '%'
   ports:
   - "3306:3306"
   restart: always

  app:
    restart: always
    build: ./app
    working_dir: /app
    volumes:
      - ./app:/app
      - ~/.m2:/root/.m2
    ports:
      - "8080:8080"
    command: mvn clean spring-boot:run
    depends_on:
      - mysql

  angular-ui:
      restart: always
      build: ./angular-ui
      working_dir: /angular-ui
      ports:
        - "80:80"
      depends_on:
        - app

I have been trying different tutorials that use nginx and angular but i cant integrate.

My file structure is:

 -Project
    -app
    -angular-ui
    -Docker-compose.yml

inside app (Java Spring API) i have a Docker file:

FROM maven:3.5-jdk-8

inside angular-ui i have a Dockerfile:

# We label our stage as 'builder'
FROM node:9-alpine as builder

COPY package.json package-lock.json ./

RUN npm set progress=false && npm config set depth 0 && npm cache clean --force

## Storing node modules on a separate layer will prevent unnecessary npm installs at each build
RUN npm i && mkdir /ng-app && cp -R ./node_modules ./ng-app

WORKDIR /ng-app

COPY . .

## Build the angular app in production mode and store the artifacts in dist folder
RUN $(npm bin)/ng build --prod


### STAGE 2: Setup ###

FROM nginx:1.13.3-alpine

## Copy our default nginx config
COPY nginx/default.conf /etc/nginx/conf.d/

## Remove default nginx website
RUN rm -rf /usr/share/nginx/html/*

## From 'builder' stage copy over the artifacts in dist folder to default nginx public folder
COPY --from=builder /ng-app/dist /usr/share/nginx/html

CMD ["nginx", "-g", "daemon off;"]

within the angular-ui folder there is an nginx folder with default.conf:

server {

  listen 80;
  listen [::]:80;

  sendfile on;

  default_type application/octet-stream;

  server_name mydomain.com www.mydomain.com;


  gzip on;
  gzip_http_version 1.1;
  gzip_disable      "MSIE [1-6]\.";
  gzip_min_length   256;
  gzip_vary         on;
  gzip_proxied      expired no-cache no-store private auth;
  gzip_types        text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
  gzip_comp_level   9;


  root /usr/share/nginx/html;


  location / {
    try_files $uri $uri/ /index.html =404;
  }

}

my question is how do integrate letsencript ssl for my angular-ui ?

If you want to learn Angular, Spring Boot API with Mysql stack then you should go for angular course. For more details you can also check this link https://www.cetpainfotech.com/technology/angularjs-training