Add Docker configuration for frontend and backend services

Author: KayvanShah1

docker-compose.yml

@@ -5,29 +5,26 @@ services:
       dockerfile: Dockerfile
     image: kayvan999/taskaza:latest
     container_name: taskaza-api
-
-    # <port on localhost>:<port on container>
+    depends_on:
+      db:
+        condition: service_healthy
+    restart: unless-stopped
     ports: 
       - 8000:8000
-
-    # creating a bind mount to keep our container and dev env in sync
-    # with read only command for added security
     volumes:
       - ./backend:/usr/src/app:ro
       - ./backend/data:/usr/src/app/data
-    
-    # override the command to start the server with --reload
     command: fastapi dev app/main.py --host 0.0.0.0 --port 8000
-    
     env_file: ./backend/.env
-
+    environment:
+      TSKZ_DATABASE_URL: postgresql+asyncpg://taskaza_user:taskaza_password@db:5432/taskaza_db
     networks:
       - taskaza-nw
 
   db:
     image: postgres:17
     container_name: taskaza-db
-    restart: always
+    restart: unless-stopped
     environment:
       POSTGRES_USER: taskaza_user
       POSTGRES_PASSWORD: taskaza_password
@@ -38,6 +35,30 @@ services:
       - 5432:5432
     networks:
       - taskaza-nw
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U taskaza_user -d taskaza_db"]
+      interval: 5s
+      timeout: 3s
+      retries: 10
+
+  frontend:
+    image: kayvan999/taskaza-ui:latest
+    build:
+      context: ./frontend
+      dockerfile: Dockerfile.dev
+    container_name: taskaza-ui
+    ports:
+      - "3000:3000"
+    volumes:
+      - ./frontend:/app
+      - /app/node_modules
+    environment:
+      NODE_ENV: development
+      NEXT_TELEMETRY_DISABLED: 1
+    command: npm run dev
+    networks:
+      - taskaza-nw
+    restart: unless-stopped
 
 networks:
   taskaza-nw:

frontend/.dockerignore

@@ -0,0 +1,16 @@
+# Node / Next
+node_modules
+.next
+out
+# Vercel/CI
+.vercel
+.github
+# Logs & misc
+npm-debug.log*
+yarn.lock
+pnpm-lock.yaml
+*.local
+.DS_Store
+coverage
+.next
+Dockerfile.*

frontend/Dockerfile.dev

@@ -0,0 +1,12 @@
+FROM node:20-alpine
+WORKDIR /app
+
+ENV NEXT_TELEMETRY_DISABLED=1
+
+COPY package.json package-lock.json ./
+RUN npm ci
+
+COPY . .
+
+EXPOSE 3000
+CMD ["npm", "run", "dev"]

frontend/Dockerfile.prod

@@ -0,0 +1,59 @@
+# ---- Base metadata ----
+# Build-time args (optional overrides)
+ARG NODE_VERSION=20-alpine
+
+# ---- Deps stage: install only production deps based on lockfile ----
+FROM node:${NODE_VERSION} AS deps
+WORKDIR /app
+
+# Speed up installs & keep image clean
+ENV CI=true \
+    NEXT_TELEMETRY_DISABLED=1
+
+# Copy only files needed to compute dependency graph
+COPY package.json package-lock.json ./
+
+# Install deps (ci = clean install from lockfile)
+RUN npm ci
+
+# ---- Builder stage: build Next.js app ----
+FROM node:${NODE_VERSION} AS builder
+WORKDIR /app
+ENV CI=true NEXT_TELEMETRY_DISABLED=1
+
+# Copy installed deps from deps stage
+COPY --from=deps /app/node_modules ./node_modules
+
+# Copy the rest of the app
+# (Your repo has code under src/, app/, components/, etc.)
+COPY . .
+
+# Build Next.js for production
+RUN npm run build
+
+# ---- Runner stage: minimal runtime image ----
+FROM node:${NODE_VERSION} AS runner
+WORKDIR /app
+
+ENV NODE_ENV=production \
+    NEXT_TELEMETRY_DISABLED=1 \
+    PORT=3000 \
+    HOSTNAME=0.0.0.0
+
+# Create non-root user
+RUN addgroup -g 1001 -S nodejs && adduser -S nextjs -u 1001
+
+# Copy the standalone output produced by Next.js
+# This keeps runtime image small and fast
+COPY --from=builder /app/.next/standalone ./
+# Static assets
+COPY --from=builder /app/.next/static ./.next/static
+# Public folder (favicons, images, robots.txt, etc.)
+COPY --from=builder /app/public ./public
+
+# Ownership for non-root
+RUN chown -R nextjs:nodejs /app
+USER nextjs
+
+EXPOSE 3000
+CMD ["node", "server.js"]