Docker and Workflow

frontend/Dockerfile

@@ -0,0 +1,35 @@
+# Stage 1: Build the Angular application
+FROM node:20-alpine AS builder
+
+WORKDIR /app
+
+# Copy package files and install dependencies
+# This leverages Docker's layer caching, so dependencies are only re-downloaded when package.json changes.
+COPY package.json package-lock.json ./
+RUN npm install
+
+# Copy the rest of the application source code
+COPY . .
+
+# Build the application for production
+# The output will be in the /app/dist/ directory
+RUN npm run build
+
+# Stage 2: Serve the application with Nginx
+FROM nginx:alpine
+
+# Remove the default Nginx configuration
+RUN rm /etc/nginx/conf.d/default.conf
+
+# Copy the custom Nginx configuration from the local machine
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# Copy the built application from the builder stage to Nginx's web root directory
+# I am assuming the project name is 'dashboard'. If not, you may need to change the path 'dist/dashboard/browser'.
+COPY --from=builder /app/dist/dashboard/browser /usr/share/nginx/html
+
+# Expose port 80 for the web server
+EXPOSE 80
+
+# The default Nginx command will start the server
+CMD ["nginx", "-g", "daemon off;"]