add

backend/.dockerignore

@@ -0,0 +1,6 @@
+__pycache__
+*.pyc
+.env
+venv
+.git
+

backend/Dockerfile

@@ -0,0 +1,31 @@
+# ---------- Build Stage ----------
+FROM python:3.11-slim AS builder
+
+WORKDIR /app
+RUN apt-get update && apt-get install -y build-essential
+
+COPY requirements.txt .
+RUN pip install --user -r requirements.txt
+
+
+# ---------- Runtime Stage ----------
+FROM python:3.11-slim
+
+WORKDIR /app
+
+# Create non-root user
+RUN useradd -m appuser
+
+COPY --from=builder /root/.local /home/appuser/.local
+COPY . .
+
+# 🔑 THIS IS THE FIX
+RUN chown -R appuser:appuser /app
+
+ENV PATH=/home/appuser/.local/bin:$PATH
+
+USER appuser
+
+EXPOSE 8000
+CMD ["python", "manage.py", "runserver", "0.0.0.0:8000"]
+

backend/config/settings.py

@@ -25,7 +25,7 @@
 # SECURITY WARNING: don't run with debug turned on in production!
 DEBUG = True
 
-ALLOWED_HOSTS = []
+ALLOWED_HOSTS = ["*"]
 
 
 # Application definition

backend/requirements.txt

@@ -0,0 +1,3 @@
+Django==4.2.7
+djangorestframework==3.14.0
+django-cors-headers==4.3.1

docker-compose.yml

@@ -0,0 +1,28 @@
+version: "3.9"
+
+services:
+  backend:
+    build: ./backend
+    container_name: django-backend
+    ports:
+      - "8000:8000"
+    environment:
+      DEBUG: "True"
+    networks:
+      - app-network
+
+  frontend:
+    build: ./frontend
+    container_name: react-frontend
+    ports:
+      - "3000:80"
+    environment:
+      VITE_API_URL: "http://backend:8000"
+    depends_on:
+      - backend
+    networks:
+      - app-network
+
+networks:
+  app-network:
+

frontend/.dockerignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+.git
+

frontend/Dockerfile

@@ -0,0 +1,25 @@
+# ---------- Build Stage ----------
+FROM node:20-alpine AS builder
+
+WORKDIR /app
+COPY package*.json ./
+RUN npm install
+
+COPY . .
+RUN npm run build
+
+# ---------- Runtime Stage ----------
+FROM nginx:alpine
+
+# Create non-root user
+RUN adduser -D appuser \
+    && mkdir -p /var/cache/nginx /var/run /run \
+    && chown -R appuser:appuser /var/cache/nginx /var/run /run /etc/nginx /usr/share/nginx/html
+
+COPY --from=builder /app/dist /usr/share/nginx/html
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+USER appuser
+
+EXPOSE 80
+

frontend/nginx.conf

@@ -0,0 +1,12 @@
+server {
+    listen 80;
+    server_name localhost;
+
+    root /usr/share/nginx/html;
+    index index.html;
+
+    location / {
+        try_files $uri /index.html;
+    }
+}
+

frontend/src/App.tsx

@@ -12,7 +12,7 @@ function App() {
     setLoading(true)
     setError(null)
     try {
-      const response = await axios.get('http://localhost:8000/api/hello/')
+      const response = await axios.get(`${import.meta.env.VITE_API_URL}/api/hello/`)
       setMessage(response.data.message)
     } catch (err) {
       console.error(err)