fix: update nginx build context and add production Dockerfile

closes: #524

Author: yinanazhou

docker-compose-deployment.yml

@@ -44,15 +44,16 @@ services:
     restart: unless-stopped
 
   nginx:
-    build: ./nginx
+    build:
+      context: .
+      dockerfile: ./nginx/Dockerfile.prod
     container_name: vim-nginx
     restart: unless-stopped
     environment:
       - HOST_NAME=${HOST_NAME}
     ports:
       - "8000:80"
     volumes:
-      - ./web-app/frontend/assets/:/virtual-instrument-museum/frontend/assets/
       - vim-static:/virtual-instrument-museum/static
       - vim-media:/virtual-instrument-museum/media
     depends_on:

nginx/Dockerfile

@@ -1,3 +1,3 @@
 FROM nginx:1.25.2
 COPY ./nginx.conf /etc/nginx/nginx.conf
-COPY ./vim.conf.template /etc/nginx/templates/vim.conf.template
+COPY ./vim.conf.template /etc/nginx/templates/vim.conf.template

nginx/Dockerfile.prod

@@ -0,0 +1,14 @@
+# Production nginx: includes compiled frontend assets in the image
+# (Dev uses bind mounts instead, see docker-compose.yml)
+
+FROM node:20-slim AS frontend-builder
+COPY ./web-app/frontend/ /frontend/
+WORKDIR /frontend
+RUN npm install && npm run sass:build
+
+FROM nginx:1.25.2
+COPY ./nginx/nginx.conf /etc/nginx/nginx.conf
+COPY ./nginx/vim.conf.template /etc/nginx/templates/vim.conf.template
+# Copy static assets (images, fonts, etc.) and compiled CSS
+COPY ./web-app/frontend/assets/ /virtual-instrument-museum/frontend/assets/
+COPY --from=frontend-builder /frontend/assets/css /virtual-instrument-museum/frontend/assets/css