- Removed area/ directory with 816MB of media files - Removed sensitive FTP credentials from Git history - Implemented .env.upload system for secure deployments - Added comprehensive .gitignore for future protection This commit represents a clean slate with all sensitive data removed.
229 lines
5.5 KiB
Markdown
229 lines
5.5 KiB
Markdown
# 🚀 Deployment Guide
|
|
|
|
## 🏠 Lokale Entwicklungsumgebung
|
|
|
|
### Voraussetzungen
|
|
- **Node.js 16+** und **npm**
|
|
- **PHP 8.0+** (für lokalen Backend-Server)
|
|
- **Git** (für Versionskontrolle)
|
|
|
|
### Projekt Setup
|
|
```bash
|
|
# Repository klonen
|
|
git clone <deine-gitea-url>
|
|
cd adspreview_react
|
|
|
|
# Frontend Dependencies installieren
|
|
cd frontend/
|
|
npm install
|
|
```
|
|
|
|
### Lokalen Development Server starten
|
|
```bash
|
|
# Im frontend/ Ordner
|
|
npm run start:all
|
|
```
|
|
|
|
Dieser Befehl startet **beide Server gleichzeitig**:
|
|
- **React Development Server**: http://localhost:3000
|
|
- **PHP Backend Server**: http://localhost:8000
|
|
|
|
### Was passiert beim `npm run start:all`?
|
|
- Startet React App mit Live-Reload auf Port 3000
|
|
- Startet PHP Built-in Server auf Port 8000 für das Backend
|
|
- Verwendet `concurrently` um beide Prozesse parallel zu verwalten
|
|
- React App ist über Proxy mit PHP Backend verbunden
|
|
|
|
### Entwicklungsumgebung Features
|
|
- ✅ **Hot Reload**: Änderungen werden sofort sichtbar
|
|
- ✅ **API Proxy**: React App kommuniziert automatisch mit PHP Backend
|
|
- ✅ **Echte Daten**: Verwendet lokale JSON-Dateien als Datenbank
|
|
- ✅ **Debugging**: Console-Logs und Entwicklertools verfügbar
|
|
|
|
### Lokale URLs
|
|
- **Frontend**: http://localhost:3000 (React App)
|
|
- **Backend API**: http://localhost:8000/api/* (PHP Endpoints)
|
|
- **Files**: http://localhost:8000/area/* (Projekt-Dateien)
|
|
|
|
### Stoppen der Entwicklungsserver
|
|
Drücke `Ctrl+C` im Terminal um beide Server zu stoppen.
|
|
|
|
---
|
|
|
|
## Webspace Anforderungen
|
|
|
|
### ✅ Minimum Requirements
|
|
- **PHP 8.3+**
|
|
- **500 MB+ Speicherplatz** (je nach Projektgröße)
|
|
- **Schreibrechte** für PHP (für Storage-Ordner)
|
|
- **URL Rewriting** (mod_rewrite für Apache)
|
|
|
|
### 📁 Webspace Struktur
|
|
```
|
|
public_html/ (oder htdocs/)
|
|
├── index.html # React App Entry Point
|
|
├── static/ # CSS, JS, Media Files
|
|
├── area/ # Client Project Files
|
|
│ ├── Paramount/
|
|
│ ├── Studiocanal/
|
|
│ └── project_order.json
|
|
├── api/ # PHP Backend
|
|
├── storage/ # User Data (needs write permissions!)
|
|
│ └── data/
|
|
│ ├── admins.json
|
|
│ ├── viewers.json
|
|
│ └── clients.json
|
|
└── vendor/ # PHP Dependencies
|
|
```
|
|
|
|
## 🔧 Deployment Prozess
|
|
|
|
### 1. Setup (einmalig)
|
|
```bash
|
|
cd deployment/scripts/
|
|
./setup.sh
|
|
```
|
|
|
|
### 2. Production Build erstellen
|
|
```bash
|
|
cd deployment/scripts/
|
|
./deploy.sh
|
|
```
|
|
|
|
### 3. Upload auf Webspace
|
|
```bash
|
|
cd deployment/scripts/
|
|
|
|
#### Option A: FTP Client (FileZilla, WinSCP, etc.)
|
|
1. Öffne deinen FTP Client
|
|
2. Verbinde zu deinem Webspace
|
|
3. Navigiere zu `public_html/` oder `htdocs/`
|
|
4. Uploade den kompletten Inhalt von `backend/`
|
|
|
|
#### Option B: Command Line (automatisiert)
|
|
```bash
|
|
cd scripts/
|
|
nano upload.sh # Konfiguriere FTP-Zugangsdaten
|
|
./upload.sh
|
|
```
|
|
|
|
### 4. Webspace Konfiguration
|
|
|
|
#### .htaccess für URL Rewriting
|
|
Erstelle eine `.htaccess` Datei im Root-Verzeichnis:
|
|
```apache
|
|
RewriteEngine On
|
|
|
|
# API Routes zu index.php weiterleiten
|
|
RewriteCond %{REQUEST_URI} ^/api/
|
|
RewriteRule ^(.*)$ index.php [QSA,L]
|
|
|
|
# React Router: Alle anderen Requests zu index.html
|
|
RewriteCond %{REQUEST_FILENAME} !-f
|
|
RewriteCond %{REQUEST_FILENAME} !-d
|
|
RewriteRule . index.html [L]
|
|
```
|
|
|
|
#### Ordner-Berechtigungen setzen
|
|
```bash
|
|
# Via FTP Client oder SSH
|
|
chmod 755 storage/
|
|
chmod 755 storage/data/
|
|
chmod 644 storage/data/*.json
|
|
```
|
|
|
|
## 🔒 Sicherheit
|
|
|
|
### Sensible Dateien schützen
|
|
Erstelle `.htaccess` in `storage/`:
|
|
```apache
|
|
# Zugriff auf Storage-Dateien verbieten
|
|
<Files "*.json">
|
|
Order allow,deny
|
|
Deny from all
|
|
</Files>
|
|
```
|
|
|
|
### Environment Variablen (optional)
|
|
Erstelle `.env` im Backend-Root:
|
|
```
|
|
BACKEND_URL=https://deine-domain.de
|
|
JWT_SECRET=dein-super-sicherer-schlüssel
|
|
```
|
|
|
|
## 🎯 Live-Betrieb
|
|
|
|
### Domain Setup
|
|
- **Subdomain**: `adspreview.deine-domain.de`
|
|
- **Hauptdomain**: `deine-domain.de/adspreview/`
|
|
|
|
### SSL/HTTPS
|
|
- Aktiviere SSL in deinem Webspace-Panel
|
|
- Moderne Browser benötigen HTTPS für JWT-Tokens
|
|
|
|
### Backup Strategy
|
|
```bash
|
|
# Regelmäßige Backups der User-Daten
|
|
tar -czf backup_$(date +%Y%m%d).tar.gz storage/data/ area/
|
|
```
|
|
|
|
## 🛠️ Troubleshooting
|
|
|
|
### Häufige Probleme:
|
|
|
|
1. **"404 Not Found" bei API-Calls**
|
|
→ Prüfe URL Rewriting (.htaccess)
|
|
|
|
2. **"Permission denied" beim Login**
|
|
→ Prüfe Schreibrechte auf storage/
|
|
|
|
3. **React App lädt nicht**
|
|
→ Prüfe BACKEND_URL in der Konfiguration
|
|
|
|
4. **Uploads funktionieren nicht**
|
|
→ Prüfe PHP upload_max_filesize und post_max_size
|
|
|
|
### Debug-Modus aktivieren
|
|
In `backend/public/index.php`:
|
|
```php
|
|
// Temporär für Debugging
|
|
error_reporting(E_ALL);
|
|
ini_set('display_errors', 1);
|
|
```
|
|
|
|
## 📊 Performance Optimierung
|
|
|
|
### Gzip Compression
|
|
In `.htaccess`:
|
|
```apache
|
|
# Komprimierung aktivieren
|
|
<IfModule mod_deflate.c>
|
|
AddOutputFilterByType DEFLATE text/html text/css text/javascript application/javascript application/json
|
|
</IfModule>
|
|
```
|
|
|
|
### Caching Headers
|
|
```apache
|
|
# Browser-Caching für statische Dateien
|
|
<IfModule mod_expires.c>
|
|
ExpiresActive on
|
|
ExpiresByType text/css "access plus 1 month"
|
|
ExpiresByType application/javascript "access plus 1 month"
|
|
ExpiresByType image/png "access plus 1 month"
|
|
ExpiresByType image/jpg "access plus 1 month"
|
|
</IfModule>
|
|
```
|
|
|
|
## ✅ Deployment Checklist
|
|
|
|
- [ ] PHP 8.3+ verfügbar
|
|
- [ ] Skripte ausgeführt (`setup.sh` → `deploy.sh`)
|
|
- [ ] Backend-Ordner hochgeladen
|
|
- [ ] .htaccess konfiguriert
|
|
- [ ] Berechtigungen gesetzt
|
|
- [ ] SSL aktiviert
|
|
- [ ] Admin-User angelegt
|
|
- [ ] Test-Login erfolgreich
|
|
|
|
**Anwendung ist live! 🎉**
|