feat: add frontend dev container to docker-compose #7

Merged
marcel merged 10 commits from feat/frontend-dockerfile into main 2026-03-19 12:07:20 +01:00
3 changed files with 47 additions and 19 deletions
Showing only changes of commit 3280125140 - Show all commits

View File

@@ -68,7 +68,7 @@ services:
restart: unless-stopped
volumes:
- .:/workspaces/familienarchiv:cached
- ./import-data:/import # Mappt den lokalen Ordner "import-data" auf "/import" im Container
- ./import:/import # Mappt den lokalen Ordner "import-data" auf "/import" im Container
depends_on:
db:
condition: service_healthy
@@ -89,24 +89,37 @@ services:
networks:
- archive-net
# --- Frontend: SvelteKit ---
# Auch hier brauchen wir erst das Dockerfile im frontend Ordner.
# frontend:
# build: ./frontend
# container_name: archive-frontend
# restart: unless-stopped
# depends_on:
# - backend
# environment:
# # SvelteKit SSR braucht die interne Docker-URL zum Backend
# API_BASE_URL: http://backend:8080
# # Der Browser braucht die öffentliche URL (falls Client-Side Fetching genutzt wird)
# PUBLIC_API_BASE_URL: http://localhost:${PORT_BACKEND}
# ports:
# - "${PORT_FRONTEND}:3000"
# networks:
# - archive-net
# --- Frontend: SvelteKit (Dev Server) ---
frontend:
build:
context: ./frontend
dockerfile: Dockerfile
container_name: archive-frontend
restart: unless-stopped
depends_on:
db:
condition: service_healthy
minio:
condition: service_healthy
backend:
condition: service_started
volumes:
- ./frontend:/app
# Keep container's node_modules separate from host to avoid OS binary conflicts
- frontend_node_modules:/app/node_modules
environment:
# SSR calls (server-side) use the internal Docker network
API_INTERNAL_URL: http://backend:8080
# Vite dev proxy forwards /api from browser to the backend container
API_PROXY_TARGET: http://backend:8080
ports:
- "${PORT_FRONTEND}:5173"
networks:
- archive-net
networks:
archive-net:
driver: bridge
volumes:
frontend_node_modules:

15
frontend/Dockerfile Normal file
View File

@@ -0,0 +1,15 @@
FROM node:20-alpine
WORKDIR /app
# Install dependencies as a separate layer so they are cached when only source changes
COPY package.json package-lock.json ./
RUN npm ci
# Source is mounted at runtime via docker-compose volume
# This COPY is only used when building without a volume (e.g. production image)
COPY . .
EXPOSE 5173
CMD ["npm", "run", "dev"]

View File

@@ -12,7 +12,7 @@ export default defineConfig({
// Proxy für API-Aufrufe während der Entwicklung (Browser -> Vite -> Spring Boot)
proxy: {
'/api': {
target: 'http://localhost:8080',
target: process.env.API_PROXY_TARGET || 'http://localhost:8080',
changeOrigin: true
}
}