# MYP Frontend Produktions-Deployment ## Übersicht Das Frontend läuft jetzt auf **Port 80/443** mit **selbstsigniertem Zertifikat** über **Caddy** als Reverse Proxy. Port 3000 wurde komplett entfernt. ## Architektur ``` Internet/LAN → Caddy (Port 80/443) → Next.js Frontend (Port 80) → Backend API (raspberrypi:443) ``` ## Deployment ### Schnellstart ```bash cd frontend ./deploy-production.sh ``` ### Manuelles Deployment ```bash cd frontend # Container stoppen docker-compose -f docker-compose.production.yml down # Neu bauen und starten docker-compose -f docker-compose.production.yml up --build -d # Status prüfen docker-compose -f docker-compose.production.yml ps # Logs anzeigen docker-compose -f docker-compose.production.yml logs -f ``` ## Konfiguration ### SSL-Zertifikate - **Automatisch generiert**: Caddy generiert automatisch selbstsignierte Zertifikate - **Speicherort**: `./certs/` (wird automatisch erstellt) - **Konfiguration**: `tls internal` in der Caddyfile ### Ports - **HTTP**: Port 80 - **HTTPS**: Port 443 - **Frontend intern**: Port 80 (nicht nach außen exponiert) ### Backend-Verbindung - **Backend URL**: `https://raspberrypi:443` - **API Prefix**: `/api/*` wird an Backend weitergeleitet - **Health Check**: `/health` wird an Backend weitergeleitet ## Dateien ### Wichtige Konfigurationsdateien - `docker-compose.production.yml` - Produktions-Docker-Konfiguration - `docker/caddy/Caddyfile` - Caddy Reverse Proxy Konfiguration - `Dockerfile` - Frontend Container (Port 80) - `next.config.js` - Next.js Konfiguration (SSL entfernt) ### Verzeichnisstruktur ``` frontend/ ├── certs/ # SSL-Zertifikate (automatisch generiert) ├── docker/ │ └── caddy/ │ └── Caddyfile # Caddy Konfiguration ├── docker-compose.production.yml # Produktions-Deployment ├── deploy-production.sh # Deployment-Script ├── Dockerfile # Produktions-Container └── next.config.js # Next.js Konfiguration ``` ## Troubleshooting ### Container Status prüfen ```bash docker-compose -f docker-compose.production.yml ps ``` ### Logs anzeigen ```bash # Alle Logs docker-compose -f docker-compose.production.yml logs -f # Nur Frontend docker-compose -f docker-compose.production.yml logs -f frontend # Nur Caddy docker-compose -f docker-compose.production.yml logs -f caddy ``` ### SSL-Zertifikate neu generieren ```bash # Container stoppen docker-compose -f docker-compose.production.yml down # Caddy Daten löschen docker volume rm frontend_caddy_data frontend_caddy_config # Neu starten docker-compose -f docker-compose.production.yml up --build -d ``` ### Container neu bauen ```bash # Alles stoppen und entfernen docker-compose -f docker-compose.production.yml down --volumes --remove-orphans # Images entfernen docker rmi frontend_frontend frontend_caddy # Neu bauen docker-compose -f docker-compose.production.yml up --build -d ``` ## Sicherheit ### HTTPS-Header Caddy setzt automatisch sichere HTTP-Header: - `Strict-Transport-Security` - `X-Content-Type-Options` - `X-Frame-Options` - `Referrer-Policy` ### Netzwerk-Isolation - Frontend und Caddy laufen in eigenem Docker-Netzwerk - Nur Ports 80 und 443 sind nach außen exponiert - Backend-Verbindung über gesichertes HTTPS ## Offline-Betrieb Das Frontend ist für Offline-Betrieb konfiguriert: - Keine externen Dependencies zur Laufzeit - Alle Assets sind im Container enthalten - Selbstsignierte Zertifikate benötigen keine externe CA