docs: add VPS deployment guide and script
- deploy-vps.sh: automated deployment script - DEPLOYMENT.md: comprehensive deployment documentation - Manual and automated deployment steps - Validation checklist - Troubleshooting guide - Expected metrics after 7 days Ready for VPS deployment via SSH
This commit is contained in:
Jan Wagner
+237
@@ -0,0 +1,237 @@
|
|||||||
|
# W-Make Portfolio VPS Deployment Guide
|
||||||
|
**Generiert:** 2026-08-22
|
||||||
|
**Commits:** c822a11, 7228fee, 4717404
|
||||||
|
**Änderungen:** Hero-Copy, Demo-CTA, Benefit-Liste, SEO, Mobile-Optimierung
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## ✅ Was wurde geändert
|
||||||
|
|
||||||
|
### Content:
|
||||||
|
- Hero H1: "Wenn Zahlen zwischen Schichten verschwinden..." (statt Fachsprache)
|
||||||
|
- Neue Demo-CTA Section nach Hero
|
||||||
|
- CTA-Box mit Benefit-Checklist (✓ 2 Tage Response, ✓ Ehrliche Einschätzung, ✓ Keine Folien)
|
||||||
|
- Aside erweitert: erklärt Versagensmodell
|
||||||
|
|
||||||
|
### Technical:
|
||||||
|
- `"type": "module"` in package.json (behebt Node.js Warnungen)
|
||||||
|
- `/api/health` endpoint hinzugefügt
|
||||||
|
- Twitter Card + OG Image Support
|
||||||
|
- Meta Descriptions aktualisiert
|
||||||
|
- Mobile Touch-Targets (44x44px WCAG 2.1 AA)
|
||||||
|
- Responsive Typography mit clamp()
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🚀 Deployment auf free-warez.win VPS
|
||||||
|
|
||||||
|
### Option A: Automatisches Script (empfohlen)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 1. SSH zum VPS
|
||||||
|
ssh eldov@free-warez.win # oder 100.90.92.125
|
||||||
|
|
||||||
|
# 2. Script von lokal kopieren (von deinem Laptop aus)
|
||||||
|
scp /home/eldov-ryzen5/workspace/Coding/Web/w-make-com/deploy-vps.sh \
|
||||||
|
eldov@free-warez.win:~/
|
||||||
|
|
||||||
|
# 3. Auf VPS ausführen
|
||||||
|
ssh eldov@free-warez.win
|
||||||
|
bash ~/deploy-vps.sh
|
||||||
|
```
|
||||||
|
|
||||||
|
### Option B: Manuelle Schritte
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 1. SSH zum VPS
|
||||||
|
ssh eldov@free-warez.win
|
||||||
|
|
||||||
|
# 2. Zum Projekt (Pfad anpassen falls anders)
|
||||||
|
cd /home/eldov/projects/w-make-portfolio # oder /opt/ oder /srv/
|
||||||
|
# Falls unsicher: find / -name "w-make-portfolio" -type d 2>/dev/null
|
||||||
|
|
||||||
|
# 3. Git pull
|
||||||
|
git pull origin main
|
||||||
|
|
||||||
|
# Erwartete Commits:
|
||||||
|
# 4717404 feat: complete SEO and mobile Quick Wins
|
||||||
|
# 7228fee feat(homepage): improve hero copy and CTA conversion
|
||||||
|
# c822a11 chore: add ES module type, health endpoint, and security docs
|
||||||
|
|
||||||
|
# 4. Docker neu bauen
|
||||||
|
docker-compose build w-make-portfolio
|
||||||
|
|
||||||
|
# 5. Container neu starten
|
||||||
|
docker-compose up -d w-make-portfolio
|
||||||
|
|
||||||
|
# 6. Warten & Health-Check
|
||||||
|
sleep 5
|
||||||
|
curl http://localhost:3000/api/health
|
||||||
|
|
||||||
|
# Erwartete Antwort:
|
||||||
|
# {"status":"ok","timestamp":"2026-08-22T...","service":"w-make-portfolio"}
|
||||||
|
|
||||||
|
# 7. Logs prüfen
|
||||||
|
docker-compose logs --tail=30 w-make-portfolio
|
||||||
|
|
||||||
|
# Erwartete Zeile:
|
||||||
|
# ✓ Ready in XXXms
|
||||||
|
# ○ Local: http://0.0.0.0:3000
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## ✅ Validierung nach Deployment
|
||||||
|
|
||||||
|
### 1. Homepage testen (https://w-make.com)
|
||||||
|
|
||||||
|
**Hero-Section:**
|
||||||
|
```
|
||||||
|
✓ H1: "Wenn Zahlen zwischen Schichten verschwinden, liegt es meist an der Software."
|
||||||
|
✓ Aside: "Die Software kennt die Reihenfolge nicht."
|
||||||
|
✓ Aside erwähnt: "stille Korrekturen und Zahlen, die morgens nicht mehr stimmen"
|
||||||
|
```
|
||||||
|
|
||||||
|
**Demo-CTA:**
|
||||||
|
```
|
||||||
|
✓ Nach Hero erscheint Section mit dunklerem Hintergrund
|
||||||
|
✓ Text: "W-Make Batch live erleben"
|
||||||
|
✓ Subtext: "Öffentliche Demo ohne Anmeldung · batch.w-make.com"
|
||||||
|
✓ Button: "Demo öffnen →" (führt zu https://batch.w-make.com)
|
||||||
|
```
|
||||||
|
|
||||||
|
**CTA-Box (am Ende):**
|
||||||
|
```
|
||||||
|
✓ Kicker: "30-Min. Erstanalyse · Kostenlos"
|
||||||
|
✓ H2: "Beschreiben Sie den Prozess, der heute bricht."
|
||||||
|
✓ Benefit-Liste mit ✓-Symbolen:
|
||||||
|
✓ Antwort innerhalb von 2 Werktagen
|
||||||
|
✓ Ehrliche Einschätzung, ob ich den Fall führen kann
|
||||||
|
✓ Keine Folien nötig, nur Verständnis des Ablaufs
|
||||||
|
✓ Button hat Hover-Effekt (copper-deep)
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. Meta-Tags validieren
|
||||||
|
|
||||||
|
**Open Graph:**
|
||||||
|
```bash
|
||||||
|
curl -sI https://w-make.com | grep -i "content-type\|x-"
|
||||||
|
```
|
||||||
|
|
||||||
|
**Tools:**
|
||||||
|
- https://www.opengraph.xyz/ → URL eingeben
|
||||||
|
- https://cards-dev.twitter.com/validator
|
||||||
|
|
||||||
|
**Erwartete OG-Werte:**
|
||||||
|
- Title: "Jan Wagner · Software für industrielle Prozesse"
|
||||||
|
- Description: "Software für industrielle Prozesse, in denen Rezept, Material..."
|
||||||
|
- Image: 1200x630 mit neuem Hero-Text
|
||||||
|
|
||||||
|
### 3. Mobile-Test
|
||||||
|
|
||||||
|
**Chrome DevTools:**
|
||||||
|
```
|
||||||
|
F12 → Toggle Device Toolbar (Ctrl+Shift+M)
|
||||||
|
Testen auf:
|
||||||
|
- iPhone SE (375px)
|
||||||
|
- iPad (768px)
|
||||||
|
- Desktop (1920px)
|
||||||
|
```
|
||||||
|
|
||||||
|
**Prüfen:**
|
||||||
|
```
|
||||||
|
✓ Touch-Targets mind. 44x44px
|
||||||
|
✓ Hero-H1 skaliert mit clamp() (nicht abgeschnitten)
|
||||||
|
✓ Sections haben reduzierten Padding auf Mobile
|
||||||
|
✓ Alle Links/Buttons klickbar ohne Zoom
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. Health-Endpoint
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl https://w-make.com/api/health
|
||||||
|
|
||||||
|
# Erwartete Antwort:
|
||||||
|
{
|
||||||
|
"status": "ok",
|
||||||
|
"timestamp": "2026-08-22T...",
|
||||||
|
"service": "w-make-portfolio"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 🐛 Troubleshooting
|
||||||
|
|
||||||
|
### Container startet nicht
|
||||||
|
```bash
|
||||||
|
# Logs prüfen
|
||||||
|
docker-compose logs w-make-portfolio
|
||||||
|
|
||||||
|
# Häufige Probleme:
|
||||||
|
# - Port 3000 bereits belegt
|
||||||
|
# - .env.local fehlt
|
||||||
|
# - Node.js Build-Fehler
|
||||||
|
```
|
||||||
|
|
||||||
|
### Health-Endpoint 404
|
||||||
|
```bash
|
||||||
|
# Prüfen ob Route existiert
|
||||||
|
docker-compose exec w-make-portfolio ls -la /app/.next/server/app/api/health/
|
||||||
|
|
||||||
|
# Falls nicht: Build war nicht vollständig
|
||||||
|
docker-compose build --no-cache w-make-portfolio
|
||||||
|
docker-compose up -d w-make-portfolio
|
||||||
|
```
|
||||||
|
|
||||||
|
### Alte Version noch online
|
||||||
|
```bash
|
||||||
|
# Hard-Refresh im Browser (Ctrl+Shift+R)
|
||||||
|
# Oder Traefik-Cache clearen (wenn vorhanden)
|
||||||
|
|
||||||
|
# Prüfen welche Version läuft:
|
||||||
|
docker-compose exec w-make-portfolio cat /app/package.json | grep version
|
||||||
|
```
|
||||||
|
|
||||||
|
### Git Pull schlägt fehl
|
||||||
|
```bash
|
||||||
|
# Auth-Problem mit Gitea
|
||||||
|
git remote -v
|
||||||
|
# Falls SSH: git remote set-url origin https://gitea.free-warez.win/eldov/w-make-portfolio.git
|
||||||
|
|
||||||
|
# Untracked files im Weg
|
||||||
|
git status
|
||||||
|
git stash # Lokale Änderungen sichern
|
||||||
|
git pull origin main
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📊 Erwartete Metriken (nach 7 Tagen)
|
||||||
|
|
||||||
|
| Metrik | Erwartet |
|
||||||
|
|--------|----------|
|
||||||
|
| Bounce Rate | -15% bis -25% |
|
||||||
|
| Avg. Session Duration | +30s bis +60s |
|
||||||
|
| Demo-Klicks | 5-10% aller Besucher |
|
||||||
|
| Contact Form Views | +20% bis +40% |
|
||||||
|
| Mobile Bounce | -10% bis -15% |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 📝 Notizen
|
||||||
|
|
||||||
|
- Code liegt auf Laptop: `/home/eldov-ryzen5/workspace/Coding/Web/w-make-com`
|
||||||
|
- Git-Remote: `https://gitea.free-warez.win/eldov/w-make-portfolio.git`
|
||||||
|
- VPS Tailscale: `100.90.92.125`
|
||||||
|
- Alle Tests bestanden (17/17)
|
||||||
|
- Build erfolgreich (Next.js 16.3.1)
|
||||||
|
|
||||||
|
**Commit-IDs für Rollback (falls nötig):**
|
||||||
|
```bash
|
||||||
|
git log --oneline -5
|
||||||
|
# 4717404 feat: complete SEO and mobile Quick Wins
|
||||||
|
# 7228fee feat(homepage): improve hero copy and CTA conversion
|
||||||
|
# c822a11 chore: add ES module type, health endpoint, and security docs
|
||||||
|
# 042ea88 feat(site): rewrite public copy around the batch chain ← Fallback
|
||||||
|
```
|
||||||
Executable
+89
@@ -0,0 +1,89 @@
|
|||||||
|
#!/usr/bin/env bash
|
||||||
|
# deploy-w-make-portfolio.sh
|
||||||
|
# Deployment-Script für w-make.com Portfolio auf free-warez.win VPS
|
||||||
|
# Generiert von Jcode am 2026-08-22
|
||||||
|
|
||||||
|
set -euo pipefail
|
||||||
|
|
||||||
|
echo "🚀 W-Make Portfolio Deployment"
|
||||||
|
echo "================================"
|
||||||
|
echo ""
|
||||||
|
|
||||||
|
# 1. Zum Projekt-Verzeichnis navigieren
|
||||||
|
if [ -d "/home/eldov/projects/w-make-portfolio" ]; then
|
||||||
|
PROJECT_DIR="/home/eldov/projects/w-make-portfolio"
|
||||||
|
elif [ -d "/opt/w-make-portfolio" ]; then
|
||||||
|
PROJECT_DIR="/opt/w-make-portfolio"
|
||||||
|
elif [ -d "/srv/w-make-portfolio" ]; then
|
||||||
|
PROJECT_DIR="/srv/w-make-portfolio"
|
||||||
|
else
|
||||||
|
echo "❌ Projekt-Verzeichnis nicht gefunden. Bitte manuell anpassen:"
|
||||||
|
echo " PROJECT_DIR=\"/pfad/zu/w-make-portfolio\""
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
echo "📁 Projekt-Verzeichnis: $PROJECT_DIR"
|
||||||
|
cd "$PROJECT_DIR"
|
||||||
|
|
||||||
|
# 2. Git-Status prüfen
|
||||||
|
echo ""
|
||||||
|
echo "📊 Git-Status vor dem Pull:"
|
||||||
|
git status --short
|
||||||
|
git log --oneline -3
|
||||||
|
|
||||||
|
# 3. Neueste Änderungen holen
|
||||||
|
echo ""
|
||||||
|
echo "📥 Hole neueste Änderungen von origin/main..."
|
||||||
|
git fetch origin
|
||||||
|
git pull origin main
|
||||||
|
|
||||||
|
# 4. Zeige neue Commits
|
||||||
|
echo ""
|
||||||
|
echo "✨ Neue Commits:"
|
||||||
|
git log --oneline -5
|
||||||
|
|
||||||
|
# 5. Docker Image neu bauen
|
||||||
|
echo ""
|
||||||
|
echo "🔨 Baue Docker Image neu (w-make-portfolio)..."
|
||||||
|
docker-compose build w-make-portfolio
|
||||||
|
|
||||||
|
# 6. Container neu starten
|
||||||
|
echo ""
|
||||||
|
echo "🔄 Starte Container neu..."
|
||||||
|
docker-compose up -d w-make-portfolio
|
||||||
|
|
||||||
|
# 7. Warte auf Startup
|
||||||
|
echo ""
|
||||||
|
echo "⏳ Warte 5 Sekunden auf Container-Start..."
|
||||||
|
sleep 5
|
||||||
|
|
||||||
|
# 8. Health-Check
|
||||||
|
echo ""
|
||||||
|
echo "🏥 Health-Check:"
|
||||||
|
if curl -sf http://localhost:3000/api/health > /dev/null 2>&1; then
|
||||||
|
echo "✅ Health-Endpoint erreichbar"
|
||||||
|
curl -s http://localhost:3000/api/health | python3 -m json.tool
|
||||||
|
else
|
||||||
|
echo "⚠️ Health-Endpoint nicht erreichbar (möglicherweise noch am Starten)"
|
||||||
|
fi
|
||||||
|
|
||||||
|
# 9. Container-Logs anzeigen
|
||||||
|
echo ""
|
||||||
|
echo "📋 Container-Logs (letzte 20 Zeilen):"
|
||||||
|
docker-compose logs --tail=20 w-make-portfolio
|
||||||
|
|
||||||
|
# 10. Status-Zusammenfassung
|
||||||
|
echo ""
|
||||||
|
echo "================================"
|
||||||
|
echo "✅ Deployment abgeschlossen!"
|
||||||
|
echo ""
|
||||||
|
echo "Nächste Schritte:"
|
||||||
|
echo "1. Prüfe https://w-make.com im Browser"
|
||||||
|
echo "2. Validiere die neuen Änderungen:"
|
||||||
|
echo " - Hero: 'Wenn Zahlen zwischen Schichten verschwinden...'"
|
||||||
|
echo " - Demo-CTA nach Hero-Section"
|
||||||
|
echo " - CTA-Box mit Benefit-Liste (✓)"
|
||||||
|
echo ""
|
||||||
|
echo "Bei Problemen:"
|
||||||
|
echo " docker-compose logs -f w-make-portfolio"
|
||||||
|
echo ""
|
||||||
Reference in New Issue
Block a user