place_maxlan/INSTALLATION.md

r/place - Collaborative Pixel Art Platform

Installationsanleitung für deinen Server

Diese Anleitung zeigt dir, wie du die r/place Webseite auf deinem eigenen Server installierst und startest.

Systemanforderungen

• Node.js 18 oder höher (empfohlen: Node.js 20)
• PostgreSQL 12 oder höher (optional, standardmäßig wird In-Memory-Storage verwendet)
• Git (zum Herunterladen des Codes)
• Mindestens 1GB RAM
• Port 5000 verfügbar (kann in der Konfiguration geändert werden)

Schritt 1: Code herunterladen

# Repository klonen (ersetze mit deiner Git-URL)
git clone <deine-repository-url> r-place
cd r-place

Schritt 2: Abhängigkeiten installieren

# Node.js Pakete installieren
npm install

Schritt 3: Konfiguration anpassen

Bearbeite die Datei config.cfg für deine Anforderungen:

nano config.cfg

Wichtige Einstellungen:

# Canvas Einstellungen
CANVAS_WIDTH=100          # Breite in Pixeln
CANVAS_HEIGHT=100         # Höhe in Pixeln

# Cooldown Einstellungen
DEFAULT_COOLDOWN_SECONDS=5  # Wartezeit zwischen Pixel-Platzierungen

# Export Einstellungen
AUTO_EXPORT_INTERVAL_SECONDS=60  # Export alle 60 Sekunden
EXPORT_PATH=./exports/           # Speicherort für SVG-Exports

# Event Einstellungen (optional)
ENABLE_AUTOMATIC_EVENTS=false   # Automatische Events deaktiviert
EVENT_DURATION_MINUTES=30       # Event-Dauer
EVENT_INTERVAL_HOURS=6          # Abstand zwischen Events

Schritt 4: PostgreSQL Datenbank einrichten (optional)

Wenn du eine persistente Datenbank möchtest:

1. PostgreSQL installieren:

# Ubuntu/Debian
sudo apt install postgresql postgresql-contrib

# CentOS/RHEL
sudo yum install postgresql-server postgresql-contrib

2. Datenbank erstellen:

sudo -u postgres createdb rplace
sudo -u postgres createuser rplace_user
sudo -u postgres psql -c "ALTER USER rplace_user PASSWORD 'dein_passwort';"
sudo -u postgres psql -c "GRANT ALL PRIVILEGES ON DATABASE rplace TO rplace_user;"

3. Umgebungsvariable setzen:

export DATABASE_URL="postgresql://rplace_user:dein_passwort@localhost:5432/rplace"

Ohne Datenbank: Das System verwendet automatisch In-Memory-Storage (Daten gehen bei Neustart verloren).

Schritt 5: Export-Verzeichnis erstellen

mkdir -p exports
chmod 755 exports

Schritt 6: Anwendung starten

Entwicklungsmodus (empfohlen für Tests):

npm run dev

Produktionsmodus:

# Frontend builden
npm run build

# Server starten
npm start

Schritt 7: Webseite aufrufen

Öffne deinen Browser und gehe zu:

http://localhost:5000

Oder von einem anderen Computer:

http://deine-server-ip:5000

Schritt 8: Als Systemdienst einrichten (optional)

Für dauerhaften Betrieb erstelle einen systemd Service:

sudo nano /etc/systemd/system/rplace.service

Inhalt:

[Unit]
Description=r/place Pixel Art Platform
After=network.target

[Service]
Type=simple
User=www-data
WorkingDirectory=/path/to/r-place
Environment=NODE_ENV=production
Environment=DATABASE_URL=postgresql://rplace_user:dein_passwort@localhost:5432/rplace
ExecStart=/usr/bin/npm start
Restart=on-failure
RestartSec=10

[Install]
WantedBy=multi-user.target

Service aktivieren:

sudo systemctl daemon-reload
sudo systemctl enable rplace
sudo systemctl start rplace
sudo systemctl status rplace

Schritt 9: Nginx Reverse Proxy (optional)

Für bessere Performance und HTTPS:

sudo nano /etc/nginx/sites-available/rplace

Inhalt:

server {
    listen 80;
    server_name deine-domain.de;

    location / {
        proxy_pass http://localhost:5000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_cache_bypass $http_upgrade;
    }

    # WebSocket Support
    location /ws {
        proxy_pass http://localhost:5000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

Aktivieren:

sudo ln -s /etc/nginx/sites-available/rplace /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

Fehlerbehebung

Port bereits in Verwendung:

# Anderen Port verwenden
export PORT=3000
npm start

Berechtigungsfehler:

# Dateiberechtigungen prüfen
sudo chown -R www-data:www-data /path/to/r-place
sudo chmod -R 755 /path/to/r-place

Logs überprüfen:

# Systemd Service logs
sudo journalctl -u rplace -f

# Node.js direktes logging
NODE_ENV=production npm start

WebSocket-Verbindung fehlschlägt:

• Firewall-Regeln prüfen
• Nginx WebSocket-Konfiguration überprüfen
• Browser-Entwicklertools verwenden

Backup und Wartung

Automatisches Backup der Exports:

# Cron-Job für tägliches Backup
0 2 * * * tar -czf /backup/rplace-exports-$(date +\%Y\%m\%d).tar.gz /path/to/r-place/exports/

Datenbank-Backup (falls PostgreSQL verwendet):

# Tägliches Datenbank-Backup
0 3 * * * pg_dump rplace > /backup/rplace-db-$(date +\%Y\%m\%d).sql

Log-Rotation:

# Logs automatisch rotieren
sudo nano /etc/logrotate.d/rplace

Performance-Optimierung

Für viele gleichzeitige Nutzer:

• Node.js Cluster-Modus verwenden
• Redis für Session-Speicherung
• PostgreSQL mit Connection Pooling
• CDN für statische Dateien

Monitoring:

• PM2 für Process Management
• Prometheus für Metriken
• Grafana für Visualisierung

Support

Bei Problemen:

1. Logs überprüfen (journalctl -u rplace)
2. Konfiguration kontrollieren (config.cfg)
3. Netzwerk-Verbindung testen
4. Browser-Entwicklertools verwenden

Lizenz

Dieses Projekt steht unter der MIT-Lizenz.