Add Docker Deployment

.env.example

@@ -0,0 +1,2 @@
+SPOTIPY_CLIENT_ID=<your_spotify_client_id>
+SPOTIPY_CLIENT_SECRET=<your_spotify_client_secret

.gitignore

@@ -0,0 +1 @@
+.env

README.md

@@ -67,3 +67,23 @@ cd SpotTransfer
     ```
     If you wish, you can build the app and serve it as well but the dev server works just fine for now.
 4. Open your browser and go to `http://localhost:5173`.
+
+## 🐳 Docker
+
+If you are already familiar with docker, then self hosting SpotTransfer will become much simpler.
+
+1. Clone the repo.
+    ```bash
+    git clone https://github.com/Pushan2005/SpotTransfer.git
+    cd SpotTransfer
+    ```
+2. Create an `.env` file and add your Spotify credentials (get these from the [Spotify Developer Dashboard](https://developer.spotify.com/dashboard/)):
+    ```env
+    SPOTIPY_CLIENT_ID=<your_spotify_client_id>
+    SPOTIPY_CLIENT_SECRET=<your_spotify_client_secret>
+    ```
+3. Build and run both containers
+    ```bash
+    docker compose up -d --build
+    ```
+4. Open your browser and go to `http://localhost:5173`.

backend/Dockerfile

@@ -0,0 +1,36 @@
+# ---- Base Image ----
+FROM python:3.12-slim AS base
+
+# Set working directory
+WORKDIR /app
+
+# Prevent Python from writing .pyc files and enable unbuffered logs
+ENV PYTHONDONTWRITEBYTECODE=1
+ENV PYTHONUNBUFFERED=1
+
+# Install system deps (for pip + building some packages)
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    build-essential \
+ && rm -rf /var/lib/apt/lists/*
+
+# Copy dependency file and install requirements
+COPY requirements.txt ./
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Copy app code
+COPY . .
+
+# Expose Flask app port
+EXPOSE 8080
+
+# Set environment variables for Flask
+ENV FLASK_APP=main.py
+ENV FLASK_RUN_HOST=0.0.0.0
+ENV FLASK_RUN_PORT=8080
+# Set environment variables for spottransfer
+# ENV SPOTIPY_CLIENT_ID=<your_spotify_client_id>
+# ENV SPOTIPY_CLIENT_SECRET=<your_spotify_client_secret>
+ENV FRONTEND_URL=http://localhost:5173
+
+# Run the Flask app
+CMD ["flask", "run"]

docker-compose.yml

@@ -0,0 +1,37 @@
+version: "3.9"
+
+services:
+  spottransfer-backend:
+    build:
+      context: ./backend
+      dockerfile: Dockerfile
+    container_name: spottransfer-backend
+    image: spottransfer-backend:latest
+    ports:
+      - "8080:8080"
+    env_file: .env
+    environment:
+      # FRONTEND_URL as seen from the browser for CORS
+      - FRONTEND_URL=http://localhost:5173
+    networks:
+      - spottransfer-network
+
+  spottransfer-frontend:
+    build:
+      context: ./frontend
+      dockerfile: Dockerfile
+    container_name: spottransfer-frontend
+    image: spottransfer-frontend:latest
+    ports:
+      - "5173:5173"
+    environment:
+      # Point frontend to backend’s internal hostname
+      - VITE_API_URL=http://spottransfer-backend:8080
+    depends_on:
+      - spottransfer-backend
+    networks:
+      - spottransfer-network
+
+networks:
+  spottransfer-network:
+    driver: bridge

frontend/Dockerfile

@@ -0,0 +1,41 @@
+# ---- Stage 1: Build ----
+FROM node:20-alpine AS build
+
+WORKDIR /app
+
+# Enable pnpm
+RUN corepack enable && corepack prepare pnpm@latest --activate
+
+# Copy dependency files
+COPY package.json pnpm-lock.yaml ./
+
+# Install dependencies
+RUN pnpm install --frozen-lockfile
+
+# Copy app source
+COPY . .
+
+# Build Vite app
+ENV VITE_API_URL=http://localhost:8080
+RUN pnpm run build
+
+
+# ---- Stage 2: Serve ----
+FROM node:20-alpine AS production
+
+WORKDIR /app
+
+# Enable pnpm
+RUN corepack enable && corepack prepare pnpm@latest --activate
+
+# Copy built app
+COPY --from=build /app/dist ./dist
+
+# Expose Vite port
+EXPOSE 5173
+
+# Default ENV (can override)
+ENV VITE_API_URL=http://localhost:8080
+
+# Use npx to run serve directly
+CMD ["npx", "serve", "-s", "dist", "-l", "5173"]