From c35890664141ab4d4c2252cacf958ede280d21b5 Mon Sep 17 00:00:00 2001 From: zchriste Date: Thu, 1 Dec 2022 12:29:59 +0100 Subject: [PATCH 1/3] updated docker files, integrated nginx --- client/Dockerfile | 22 +++++++++++++++++ client/app/Components/Globals/DummyData.ts | 6 ++--- client/docker-external-config.json | 5 ++++ client/nginx.conf | 14 +++++++++++ docker-compose.yml | 28 ++++++++++++++++++---- 5 files changed, 66 insertions(+), 9 deletions(-) create mode 100644 client/Dockerfile create mode 100644 client/docker-external-config.json create mode 100644 client/nginx.conf diff --git a/client/Dockerfile b/client/Dockerfile new file mode 100644 index 0000000..9891642 --- /dev/null +++ b/client/Dockerfile @@ -0,0 +1,22 @@ +# 1. Build +FROM node:lts AS build +WORKDIR /app + +COPY package.json ./package.json +RUN npm install +COPY . /app +RUN npm run build + +# 2. Deploy +FROM nginx:latest +RUN apt-get update \ + && apt-get install -y --no-install-recommends \ + apache2-utils curl \ + && rm -rf /var/lib/apt/lists/* +COPY nginx.conf /etc/nginx/conf.d/default.conf +# COPY --from=build /app/. /usr/share/nginx/html +COPY docker-external-config.json /usr/share/nginx/html/docker-external-config.json +EXPOSE 80 440 + +HEALTHCHECK --interval=60s --timeout=30s --start-period=1s --retries=3 CMD curl --fail http://localhost/health || exit 1 +CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file diff --git a/client/app/Components/Globals/DummyData.ts b/client/app/Components/Globals/DummyData.ts index b0f7a3f..632d261 100644 --- a/client/app/Components/Globals/DummyData.ts +++ b/client/app/Components/Globals/DummyData.ts @@ -10,16 +10,14 @@ export const dummyTasks: ITask[] = [ { id: "37489248923489", title: "Migration from LiteDb to MongoDb", - issueNumber: "37", description: "How long do you think would a migration from LiteDb to MongoDb take? Since we have no initial data, we can omit this step.", - isActive: false, + status: 0, }, { id: "3741231283913489", title: "Move to WebSockets", - issueNumber: "38", description: "How long do you think do we need to integrate WebSockets?", - isActive: false, + status: 3, }, ]; diff --git a/client/docker-external-config.json b/client/docker-external-config.json new file mode 100644 index 0000000..052be41 --- /dev/null +++ b/client/docker-external-config.json @@ -0,0 +1,5 @@ +{ + "version": "docker-version", + "restPathRoot": "api/", + "restServiceRoot": "api/services/rest/" +} \ No newline at end of file diff --git a/client/nginx.conf b/client/nginx.conf new file mode 100644 index 0000000..2e3d7a9 --- /dev/null +++ b/client/nginx.conf @@ -0,0 +1,14 @@ +server { + server_name devon-estimation.dev; + root /usr/share/nginx/html; + + location ~ ^/config { + alias /usr/share/nginx/html/docker-external-config.json; + } + + location ~ ^/health { + return 200 "OK"; + } + + try_files $uri $uri/ /index.html; +} \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index 6ed6d7a..6bde8ec 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,9 +1,27 @@ version: "3.8" + services: - dotnet-estimation: - container_name: devon4net-estimation + backend: + container_name: estimation-backend build: - context: ./dotnet-estimation/Templates/WebAPI - dockerfile: ./dotnet-estimation/Devon4Net.Application.WebAPI/Dockerfile + context: ./dotnet-estimation/dotnet-estimation/Templates/WebAPI + dockerfile: ./Devon4Net.Application.WebAPI/Dockerfile + networks: + backend-net: + aliases: [backend] ports: - - 8085:8085 \ No newline at end of file + - 8085:8085 + + frontend: + container_name: estimation-frontend + build: + context: ./client + networks: + backend-net: + aliases: [backend] + ports: + - 3000:3000 + +networks: + backend-net: + driver: bridge From 4623fce7db52b4a8c69e669a1b1bd982be0d419d Mon Sep 17 00:00:00 2001 From: zchriste Date: Fri, 16 Dec 2022 11:45:07 +0100 Subject: [PATCH 2/3] webserver is now available, no connextion to frontend though --- client/Dockerfile | 4 ++-- client/nginx.conf | 15 +++++++++++++-- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/client/Dockerfile b/client/Dockerfile index 9891642..37b5df6 100644 --- a/client/Dockerfile +++ b/client/Dockerfile @@ -14,9 +14,9 @@ RUN apt-get update \ apache2-utils curl \ && rm -rf /var/lib/apt/lists/* COPY nginx.conf /etc/nginx/conf.d/default.conf -# COPY --from=build /app/. /usr/share/nginx/html +COPY --from=build /app/. /usr/share/nginx/html COPY docker-external-config.json /usr/share/nginx/html/docker-external-config.json -EXPOSE 80 440 +EXPOSE 3000 HEALTHCHECK --interval=60s --timeout=30s --start-period=1s --retries=3 CMD curl --fail http://localhost/health || exit 1 CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file diff --git a/client/nginx.conf b/client/nginx.conf index 2e3d7a9..18391e5 100644 --- a/client/nginx.conf +++ b/client/nginx.conf @@ -1,14 +1,25 @@ server { + listen 3000; server_name devon-estimation.dev; + index index.html index.htm index.tsx index.js; root /usr/share/nginx/html; location ~ ^/config { - alias /usr/share/nginx/html/docker-external-config.json; + alias /var/log/nginx/devonfw_angular_error.log; + # alias /usr/share/nginx/html/docker-external-config.json; } location ~ ^/health { return 200 "OK"; } - try_files $uri $uri/ /index.html; + location / { + # First attempt to serve request as file, then + # as directory, then fall back to displaying a 404. + try_files $uri pages/ =404; + # error_page 405 =200 $uri; + } + + # search for specified files and sets fallback +# try_files $uri /index.tsx =404; } \ No newline at end of file From 942a5e679162e5bc9ecdf60d26f9be275f56d3fa Mon Sep 17 00:00:00 2001 From: Othman Moukhli Date: Thu, 5 Jan 2023 10:52:36 +0100 Subject: [PATCH 3/3] Docker deployment for Backend Frontend and Reverse proxy --- client/.dockerignore | 3 +++ client/Dockerfile | 35 ++++++++++++++----------------- client/nginx.conf | 25 ---------------------- client/pages/session/[id].tsx | 2 +- docker-compose.yml | 9 +++++++- reverse-proxy/Dockerfile | 3 +++ reverse-proxy/nginx.conf | 39 +++++++++++++++++++++++++++++++++++ 7 files changed, 70 insertions(+), 46 deletions(-) create mode 100644 client/.dockerignore delete mode 100644 client/nginx.conf create mode 100644 reverse-proxy/Dockerfile create mode 100644 reverse-proxy/nginx.conf diff --git a/client/.dockerignore b/client/.dockerignore new file mode 100644 index 0000000..9bbded4 --- /dev/null +++ b/client/.dockerignore @@ -0,0 +1,3 @@ +// .dockerignore +node_modules +build \ No newline at end of file diff --git a/client/Dockerfile b/client/Dockerfile index 37b5df6..e8e3b9d 100644 --- a/client/Dockerfile +++ b/client/Dockerfile @@ -1,22 +1,19 @@ -# 1. Build -FROM node:lts AS build +# ==== CONFIGURE ===== +# Use a Node 16 base image +FROM node:lts +# Set the working directory to /app inside the container WORKDIR /app - -COPY package.json ./package.json -RUN npm install -COPY . /app +# Copy app files +COPY . . +# ==== BUILD ===== +# Install dependencies (npm ci makes sure the exact versions in the lockfile gets installed) +RUN npm ci +# Build the app RUN npm run build - -# 2. Deploy -FROM nginx:latest -RUN apt-get update \ - && apt-get install -y --no-install-recommends \ - apache2-utils curl \ - && rm -rf /var/lib/apt/lists/* -COPY nginx.conf /etc/nginx/conf.d/default.conf -COPY --from=build /app/. /usr/share/nginx/html -COPY docker-external-config.json /usr/share/nginx/html/docker-external-config.json +# ==== RUN ======= +# Set the env to "production" +ENV NODE_ENV development +# Expose the port on which the app will be running EXPOSE 3000 - -HEALTHCHECK --interval=60s --timeout=30s --start-period=1s --retries=3 CMD curl --fail http://localhost/health || exit 1 -CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file +# Start the app +CMD [ "npm", "start"] \ No newline at end of file diff --git a/client/nginx.conf b/client/nginx.conf deleted file mode 100644 index 18391e5..0000000 --- a/client/nginx.conf +++ /dev/null @@ -1,25 +0,0 @@ -server { - listen 3000; - server_name devon-estimation.dev; - index index.html index.htm index.tsx index.js; - root /usr/share/nginx/html; - - location ~ ^/config { - alias /var/log/nginx/devonfw_angular_error.log; - # alias /usr/share/nginx/html/docker-external-config.json; - } - - location ~ ^/health { - return 200 "OK"; - } - - location / { - # First attempt to serve request as file, then - # as directory, then fall back to displaying a 404. - try_files $uri pages/ =404; - # error_page 405 =200 $uri; - } - - # search for specified files and sets fallback -# try_files $uri /index.tsx =404; -} \ No newline at end of file diff --git a/client/pages/session/[id].tsx b/client/pages/session/[id].tsx index 3838fb1..5f2c37f 100644 --- a/client/pages/session/[id].tsx +++ b/client/pages/session/[id].tsx @@ -88,7 +88,7 @@ export async function getServerSideProps(context: any) { const { id } = params; const res = await fetch( - "http://127.0.0.1:8085/estimation/v1/session/" + id + "/status" + "http://estimation-backend:8085/estimation/v1/session/" + id + "/status" ); const data = await res.json(); diff --git a/docker-compose.yml b/docker-compose.yml index 6bde8ec..bcbdc1f 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -19,8 +19,15 @@ services: networks: backend-net: aliases: [backend] + reverse-proxy: + build: ./reverse-proxy + restart: always + container_name: 'reverse_proxy' ports: - - 3000:3000 + - 80:80 + networks: + backend-net: + aliases: [backend] networks: backend-net: diff --git a/reverse-proxy/Dockerfile b/reverse-proxy/Dockerfile new file mode 100644 index 0000000..17db432 --- /dev/null +++ b/reverse-proxy/Dockerfile @@ -0,0 +1,3 @@ +FROM nginx:latest + +COPY nginx.conf /etc/nginx/conf.d/default.conf diff --git a/reverse-proxy/nginx.conf b/reverse-proxy/nginx.conf new file mode 100644 index 0000000..6d401b2 --- /dev/null +++ b/reverse-proxy/nginx.conf @@ -0,0 +1,39 @@ +server { + listen 80; + listen 8085; + server_name _; + root /usr/share/nginx/html; + + # reverse proxy + location / { + proxy_pass http://estimation-frontend:3000; + proxy_http_version 1.1; + proxy_cache_bypass $http_upgrade; + + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "upgrade"; + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + proxy_set_header X-Forwarded-Proto $scheme; + proxy_set_header X-Forwarded-Host $host; + proxy_set_header X-Forwarded-Port $server_port; + } + + # reverse proxy + location http://localhost:8085/ { + proxy_pass http://estimation-backend:8085; + proxy_http_version 1.1; + proxy_cache_bypass $http_upgrade; + + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "upgrade"; + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + proxy_set_header X-Forwarded-Proto $scheme; + proxy_set_header X-Forwarded-Host $host; + proxy_set_header X-Forwarded-Port $server_port; + } + +}