Kevin Adametz
c62234e1ca
# Conflicts: # .gitignore # backend/vite.config.js # frontend/package-lock.json
207 lines
4.2 KiB
Markdown
207 lines
4.2 KiB
Markdown
# 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
|
|
|