production docker for frontend

backend/Dockerfile

@@ -0,0 +1,13 @@
+FROM node:lts-alpine
+
+WORKDIR /app
+
+COPY package*.json ./
+
+RUN npm install --only=prod --silent
+
+EXPOSE 3000
+
+COPY . .
+
+CMD ["npm", "run", "start"]

docker-compose.dev.yml

@@ -4,7 +4,7 @@ services:
     image: "nginx"
     restart: unless-stopped
     volumes:
-      - ./nginx.conf:/etc/nginx/conf.d/default.conf
+      - ./nginx.dev.conf:/etc/nginx/conf.d/default.conf
     ports:
       - 7655:80
     networks:

docker-compose.yml

@@ -0,0 +1,52 @@
+version: "3"
+services:
+  webproxy:
+    image: "nginx"
+    restart: unless-stopped
+    depends_on:
+      - frontend
+      - backend
+    volumes:
+      - ./nginx.conf:/etc/nginx/conf.d/default.conf
+    ports:
+      - 7655:80
+    networks:
+      - frontend
+      - backend
+  frontend:
+    build:
+      context: "frontend"
+      dockerfile: Dockerfile
+    restart: unless-stopped
+#    ports:
+#      - "8081:80"
+    networks:
+      - frontend
+  backend:
+    build:
+      context: "backend"
+      dockerfile: Dockerfile
+    restart: unless-stopped
+#    ports:
+#      - "3000:3000"
+    networks:
+      - backend
+  db:
+    image: "mongo"
+    restart: unless-stopped
+    volumes:
+      - mongodata:/data/db
+      - mongoconfig:/data/configdb
+    networks:
+      - backend
+volumes:
+  mongodata:
+    external: false
+  mongoconfig:
+    external: false
+
+networks:
+  backend:
+    driver: bridge
+  frontend:
+    driver: bridge

frontend/Dockerfile

@@ -1,11 +1,19 @@
-FROM node:14
-WORKDIR /usr/src/app
+FROM node:lts-alpine as build-stage
 
-COPY * ./
-RUN npm install
-RUN npm install @vue/cli
-RUN npm run build
+WORKDIR /app
+
+COPY package*.json ./
+
+RUN npm install --silent
 
 EXPOSE 8080
 
-CMD [ "npm", "run", "serve" ]
+COPY . .
+
+RUN npm run build
+
+FROM nginx:stable-alpine as prod-stage
+
+COPY --from=build-stage /app/dist /app
+
+COPY nginx.conf /etc/nginx/nginx.conf

frontend/nginx.conf

@@ -0,0 +1,30 @@
+user  nginx;
+worker_processes  1;
+error_log  /var/log/nginx/error.log warn;
+pid        /var/run/nginx.pid;
+events {
+  worker_connections  1024;
+}
+http {
+  include       /etc/nginx/mime.types;
+  default_type  application/octet-stream;
+  log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
+                    '$status $body_bytes_sent "$http_referer" '
+                    '"$http_user_agent" "$http_x_forwarded_for"';
+  access_log  /var/log/nginx/access.log  main;
+  sendfile        on;
+  keepalive_timeout  65;
+  server {
+    listen       80;
+    server_name  localhost;
+    location / {
+      root   /app;
+      index  index.html;
+      try_files $uri $uri/ /index.html;
+    }
+    error_page   500 502 503 504  /50x.html;
+    location = /50x.html {
+      root   /usr/share/nginx/html;
+    }
+  }
+}

nginx.conf

@@ -5,18 +5,18 @@ server {
 
     resolver 127.0.0.11;
 
-    set $frontend http://frontend:8080;
+    set $frontend http://frontend:80;
     set $backend http://backend:3000;
 
-    location / {
-        proxy_pass $frontend;
+    location /api {
+        proxy_pass $backend;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection "Upgrade";
         proxy_set_header Host $host;
     }
 
-    location /api {
-        proxy_pass $backend;
+    location / {
+        proxy_pass $frontend;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection "Upgrade";
         proxy_set_header Host $host;

nginx.dev.conf

@@ -0,0 +1,24 @@
+server {
+    listen 80;
+    listen [::]:80;
+    server_name localhost;
+
+    resolver 127.0.0.11;
+
+    set $frontend http://frontend:8080;
+    set $backend http://backend:3000;
+
+    location / {
+        proxy_pass $frontend;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "Upgrade";
+        proxy_set_header Host $host;
+    }
+
+    location /api {
+        proxy_pass $backend;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "Upgrade";
+        proxy_set_header Host $host;
+    }
+}