update dockerfile

Dockerfile

@@ -1,4 +1,30 @@
+# Usage:
+#
+#    Build image:
+#    docker build -t jojozhuang/online-judge-web .
+#
+#    Run image (on localhost:9020):
+#    docker run -d --name online-judge-web -p 9020:80 jojozhuang/online-judge-web
+#
+#    Run image as virtual host (read more: https://github.com/nginx-proxy/nginx-proxy):
+#    docker run -e VIRTUAL_HOST=online-judge-web --name online-judge-web jojozhuang/online-judge-web
+
+# Stage 1, based on Node.js, to build and compile Angular
+
+FROM node:15.12.0-alpine as builder
+
+WORKDIR /ng-app
+
+COPY package*.json tsconfig*.json angular.json ./
+COPY ./src ./src
+
+RUN npm ci --quiet && npm run build-nas
+
+# Stage 2, based on Nginx, to have only the compiled app, ready for production with Nginx
+
 FROM nginx:1.19.8-alpine
 
 COPY ./nginx.conf /etc/nginx/conf.d/default.conf
-COPY ./dist/ /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

Dockerfile-server

@@ -22,8 +22,8 @@ FROM node:15.12.0-alpine
 WORKDIR /app
 
 # environment variables
-ENV NODE_ENV=dev
-ENV PORT=80
+ENV NODE_ENV=stage \
+  PORT=9021
 
 # We just need the build to execute the command
 COPY --from=builder /usr/src/app .

docker-compose.yml

@@ -11,11 +11,11 @@ services:
       - '9042:9042'
     volumes:
       # - '/Users/johnny/Docker/leetcode/mongodb:/data/db'
-      - '/var/services/web/docker/leetcode/mongodb:/data/db'
+      - '/var/services/web/docker/online-judge/mongodb:/data/db'
     restart: always
     environment:
-      MONGO_INITDB_DATABASE: leetcode-algorithm-nas
-  # Api
+      MONGO_INITDB_DATABASE: online-judge-nas
+  # Api +
   api:
     image: jojozhuang/leetcode-algorithm-api:latest
     container_name: api

nginx.conf

@@ -1,8 +1,3 @@
-# Change this depending on environment
-upstream api {
-  server 192.168.0.2:9041;
-}
-
 server {
     listen       80;
     listen  [::]:80;
@@ -26,17 +21,6 @@ server {
         root   /usr/share/nginx/html;
     }
 
-    location /api/ {
-      proxy_pass http://api;
-      proxy_http_version 1.1;
-      proxy_set_header Upgrade $http_upgrade;
-      proxy_set_header Connection 'upgrade';
-      proxy_set_header Host $host;
-      proxy_cache_bypass $http_upgrade;
-      proxy_set_header X-Real-IP $remote_addr;
-      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-      #all incoming http request with /api/ will be forwarded to http://127.0.0.1:8087/api/
-    }
     # proxy the PHP scripts to Apache listening on 127.0.0.1:80
     #
     #location ~ \.php$ {

src/app/components/pages/header.component.css

@@ -1,4 +1,7 @@
 .env-name {
+  color: whitesmoke;
+  background-color: olivedrab;
+  margin-left: 20px;
+  padding: 0px 8px;
   font-weight: bold;
-  color: greenyellow;
 }