Added frontend dockerfile

Author: Ragini-Microsoft

content-gen/src/.dockerignore

@@ -0,0 +1,42 @@
+# Docker ignore file for src/ build context
+# Excludes unnecessary files from Docker build
+
+# Dependencies (will be installed fresh in container)
+**/node_modules/
+**/__pycache__/
+*.pyc
+
+# Build outputs (will be built in container)
+static/
+**/dist/
+frontend-server/static/
+
+# Development files
+*.log
+*.md
+.git/
+.gitignore
+.vscode/
+.env
+.env.*
+!.env.template
+
+# Test files
+**/*.test.*
+**/*.spec.*
+__tests__/
+coverage/
+tests/
+
+# IDE and OS files
+.DS_Store
+Thumbs.db
+*.swp
+*.swo
+
+# Deployment artifacts
+*.zip
+frontend-deploy.zip
+
+# Backend not needed for frontend build (and vice versa)
+# Comment out if building full-stack image

content-gen/src/WebApp.Dockerfile

@@ -1,32 +1,58 @@
-# Content Generation Solution Accelerator - Docker Image
+# ============================================
+# Frontend Dockerfile
+# Multi-stage build for Content Generation Frontend
+# Combines: frontend (React/Vite) + frontend-server (Node.js proxy)
+# ============================================
 
-FROM python:3.11-slim
+# ============================================
+# Stage 1: Build the React frontend with Vite
+# ============================================
+FROM node:20-alpine AS frontend-build
 
 WORKDIR /app
 
-# Install system dependencies
-RUN apt-get update && apt-get install -y \
-    curl \
-    && rm -rf /var/lib/apt/lists/*
+# Copy frontend package files
+COPY frontend/package*.json ./
 
-# Copy requirements first for layer caching
-COPY requirements.txt .
-RUN pip install --no-cache-dir -r requirements.txt
+# Install dependencies
+RUN npm ci
 
-# Copy application code
-COPY . .
+# Copy frontend source code
+COPY frontend/ ./
 
-# Set environment variables
-ENV PYTHONPATH=/app
-ENV PORT=8000
-ENV PYTHONUNBUFFERED=1
+# Build the frontend (outputs to ../static, but we're in /app so it goes to /static)
+# Override outDir to keep it in the container context
+RUN npm run build -- --outDir ./dist
 
-# Expose port
-EXPOSE 8000
+# ============================================
+# Stage 2: Production Node.js server
+# ============================================
+FROM node:20-alpine AS production
+
+WORKDIR /app
+
+# Copy frontend-server package files
+COPY frontend-server/package*.json ./
+
+# Install only production dependencies
+RUN npm ci --only=production
+
+# Copy the server code
+COPY frontend-server/server.js ./
+
+# Copy built frontend assets from stage 1
+COPY --from=frontend-build /app/dist ./static
+
+# Environment variables (can be overridden at runtime)
+ENV PORT=8080
+ENV NODE_ENV=production
+
+# Expose the port
+EXPOSE 8080
 
 # Health check
 HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
-    CMD curl -f http://localhost:${PORT}/health || exit 1
+    CMD node -e "require('http').get('http://localhost:' + (process.env.PORT || 8080) + '/', (r) => process.exit(r.statusCode === 200 ? 0 : 1)).on('error', () => process.exit(1))"
 
-# Run the application
-CMD ["hypercorn", "app:app", "--bind", "0.0.0.0:8000", "--workers", "1"]
+# Start the server
+CMD ["node", "server.js"]