docker setup

# Conflicts:
#	.gitignore
#	backend/vite.config.js
#	frontend/package-lock.json
This commit is contained in:
Kevin Adametz 2025-10-20 17:55:52 +02:00
parent f01a0a967f
commit c62234e1ca
546 changed files with 141382 additions and 757 deletions

207
.devcontainer/README.md Normal file
View file

@ -0,0 +1,207 @@
# DevContainer Setup für Thats-Me
## Was ist ein DevContainer?
Ein DevContainer ist eine vollständige Entwicklungsumgebung in Docker. Cursor/VSCode läuft direkt im Container und Sie entwickeln mit allen Tools, die bereits vorinstalliert sind.
## Voraussetzungen
1. **Docker Desktop** muss laufen
2. **Traefik Proxy** als externes Netzwerk:
```bash
docker network create proxy
```
## DevContainer starten
1. **In Cursor/VSCode:**
- Drücken Sie `Cmd+Shift+P` (macOS) oder `Ctrl+Shift+P` (Windows/Linux)
- Wählen Sie: **"Dev Containers: Reopen in Container"**
- Warten Sie, bis alle Container gebaut und gestartet sind
2. **Beim ersten Start:**
- Der Laravel Container wird gebaut (kann einige Minuten dauern)
- Alle Services werden gestartet (MySQL, Redis, Mailpit, Quasar)
- Sie werden automatisch im Laravel Container eingeloggt
## Was passiert beim Start?
Der DevContainer startet folgende Services:
- **laravel.test** - Laravel Backend (Sie arbeiten in diesem Container)
- **mysql** - Datenbank
- **redis** - Cache/Queue
- **mailpit** - E-Mail Testing
- **quasar.app** - Frontend App (läuft automatisch)
## Arbeiten im Container
### Terminal
Das Terminal in Cursor/VSCode ist bereits im Container. Sie können direkt arbeiten:
```bash
# Sie sind im /var/www/html Verzeichnis (= ./backend vom Host)
php artisan migrate
php artisan serve
composer install
npm install
npm run dev
```
### Verfügbare Services
Im DevContainer können Sie direkt auf die anderen Services zugreifen:
```bash
# MySQL Verbindung
mysql -h mysql -u sail -p
# Passwort: password
# Redis
redis-cli -h redis
# Composer
composer install
composer update
# Artisan
php artisan migrate
php artisan tinker
```
## Zugriff von außerhalb
### Von Ihrem Browser (Host)
Die Ports werden automatisch weitergeleitet:
- **Laravel App:** http://localhost (Port 80)
- **Vite Dev Server:** http://localhost:5173
- **Mailpit Dashboard:** http://localhost:8025
- **Quasar App:** http://localhost:9000
### Mit Traefik
Wenn Traefik läuft, können Sie auch die Domains verwenden:
- https://thats-me.test
- https://portal.thats-me.test
- https://api.thats-me.test
- https://app.thats-me.test
- https://assets.thats-me.test
## Backend .env Konfiguration
Stellen Sie sicher, dass `backend/.env` folgende Werte hat:
```env
DB_CONNECTION=mysql
DB_HOST=mysql
DB_PORT=3306
DB_DATABASE=thats-me
DB_USERNAME=sail
DB_PASSWORD=password
MAIL_MAILER=smtp
MAIL_HOST=mailpit
MAIL_PORT=1025
REDIS_HOST=redis
REDIS_PORT=6379
```
## Vite Dev Server starten
```bash
# Im DevContainer Terminal
npm install
npm run dev
```
Vite läuft dann auf Port 5173 und ist verfügbar unter:
- http://localhost:5173 (vom Host)
- https://assets.thats-me.test (mit Traefik)
## Quasar App
Die Quasar App läuft automatisch in einem separaten Container und ist verfügbar unter:
- http://localhost:9000 (vom Host)
- https://app.thats-me.test (mit Traefik)
## Troubleshooting
### Container startet nicht
```bash
# Schließen Sie den DevContainer
# Öffnen Sie ein normales Terminal auf dem Host
docker-compose down -v
docker-compose build --no-cache
# Dann neu starten: "Dev Containers: Reopen in Container"
```
### "Dockerfile not found" Fehler
Stellen Sie sicher, dass Laravel Sail installiert ist:
```bash
cd backend
composer require laravel/sail --dev
```
### Permission-Probleme
Die User-IDs in `devcontainer.json` anpassen:
```json
"containerEnv": {
"WWWUSER": "1000", // Ihre User-ID
"WWWGROUP": "1000" // Ihre Group-ID
}
```
Finden Sie Ihre IDs mit:
```bash
id -u # User ID
id -g # Group ID
```
### Logs ansehen
```bash
# Im DevContainer Terminal
docker-compose logs -f
# Nur MySQL
docker-compose logs -f mysql
# Nur Quasar
docker-compose logs -f quasar.app
```
## DevContainer verlassen
1. Drücken Sie `Cmd+Shift+P` / `Ctrl+Shift+P`
2. Wählen Sie: **"Dev Containers: Reopen Folder Locally"**
## Container stoppen
Nach dem Verlassen des DevContainers:
```bash
docker-compose down
```
## Vorteile des DevContainers
✅ Alle arbeiten mit der gleichen Umgebung
✅ Keine lokale PHP/MySQL Installation nötig
✅ Automatische Service-Verwaltung
✅ Isolierte Entwicklungsumgebung
✅ Einfaches Onboarding für neue Entwickler

View file

@ -0,0 +1,94 @@
{
"name": "Thats-Me (Dev Container)",
// 1. DIES IST DER WICHTIGSTE TEIL:
// Wir verwenden Docker Compose für alle Services
"dockerComposeFile": [
"../docker-compose.yml"
],
"service": "laravel.test",
// 3. WIR DEFINIEREN DEN ARBEITSBEREICH:
// Wir mounten das gesamte Projekt, damit Sie Backend UND Frontend sehen
"workspaceFolder": "/workspace",
// 4. WIR LEGEN DEN BENUTZER FEST:
// Laravel Sail führt Befehle standardmäßig als 'sail'-Benutzer aus, um Berechtigungsprobleme zu vermeiden.
"remoteUser": "sail",
// 5. ZUSÄTZLICHE ENTWICKLER-TOOLS (FEATURES):
// Features werden über postCreateCommand installiert um Kompatibilitätsprobleme zu vermeiden
"features": {},
// 6. BEFEHLE NACH DEM ERSTELLEN:
// Installiert nur die Tools die ohne Root-Rechte funktionieren
//"postCreateCommand": "composer install --no-interaction --prefer-dist --optimize-autoloader",
// 7. EDITOR-ANPASSUNGEN (Optional, aber sehr empfohlen):
"customizations": {
"vscode": {
"extensions": [
"bmewburn.vscode-intelephense-client",
"onecentlin.laravel-blade",
"shufo.vscode-blade-formatter",
"bradlc.vscode-tailwindcss"
]
}
},
// 8. ZU STARTENDE DIENSTE:
// Legt fest, welche Dienste aus der docker-compose.yml gestartet werden sollen.
"runServices": [
"laravel.test",
"quasar.app",
"mysql",
"redis",
"mailpit"
],
// 9. ZUSÄTZLICHE KONFIGURATION:
// Umgebungsvariablen für den DevContainer
"containerEnv": {
"WWWUSER": "501",
"WWWGROUP": "20",
"LARAVEL_SAIL": "1"
},
// 9b. MOUNTS:
// Mountet das gesamte Projekt (Root) nach /workspace, damit Sie Backend UND Frontend sehen
"mounts": [
"source=${localWorkspaceFolder},target=/workspace,type=bind,consistency=cached"
],
// 10. FORWARD PORTS:
// Ports die automatisch weitergeleitet werden sollen (Container-Ports)
"forwardPorts": [
80,
5173,
3306,
6379,
1025,
8025,
9000
],
"portsAttributes": {
"80": {
"label": "Laravel App (HTTP)",
"onAutoForward": "notify"
},
"5173": {
"label": "Vite Dev Server",
"onAutoForward": "notify"
},
"3306": {
"label": "MySQL",
"onAutoForward": "silent"
},
"6379": {
"label": "Redis",
"onAutoForward": "silent"
},
"8025": {
"label": "Mailpit Dashboard",
"onAutoForward": "notify"
},
"1025": {
"label": "Mailpit SMTP",
"onAutoForward": "silent"
},
"9000": {
"label": "Quasar App",
"onAutoForward": "notify"
}
}
}