Dokumentation

DeployPages Arbeitsanleitung

Eine praktische Anleitung für statische Websites: Dateien vorbereiten, Framework-Builds erstellen, Domains verbinden und Projekte sauber aktualisieren.

React veröffentlichenNext.js ExportDNS LookupSSL prüfenMeta-Generator

Schnellstart

Veröffentlichen heißt hier: lokale Website-Dateien werden zu einer URL, die andere öffnen können. DeployPages ist für statische Ausgaben gebaut, deshalb kann die erste Veröffentlichung mit einem Ordner starten statt mit einem Server-Setup.

Option 1: Drag-and-Drop-Deployment

Der schnellste Weg für statische Projekte. Wenn die Website bereits aus HTML, CSS, JavaScript oder einem fertigen Build-Ordner besteht, können Sie sie direkt hochladen.

Passt gut für

Landingpages, persönliche Websites, Lebensläufe, Prototypen, statische Dokumentation und andere browsernative Frontend-Ausgaben.
  • 1
    Projektordner vorbereiten

    Der veröffentlichbare Ordner sollte eine index.html im Wurzelordner enthalten sowie alle Styles, Skripte und Bilddateien, von denen die Seite abhängt.

    Beispiel-Ordnerstruktur
    my-site/├── index.html├── styles.css├── script.js└── images/    ├── logo.png    └── hero.jpg

    Häufiger Fehler

    Wenn index.html fehlt oder in einem Unterordner liegt, kann die Website nach dem Upload nicht sauber unter der Haupt-URL öffnen.
  • 2
    Upload-Bereich öffnen

    Nutzen Sie den Upload-Bereich von DeployPages. Sie können zuerst ein temporäres Projekt veröffentlichen und sich später anmelden, wenn der Link bleiben soll.

  • 3
    Ordner hochladen

    Ziehen Sie den gesamten Ordner in den Upload-Bereich oder wählen Sie ihn im Dateidialog aus. Bei Frameworks laden Sie den Ausgabeordner hoch, nicht den Quellbaum.

  • 4
    Generierte URL öffnen

    Nach dem Upload gibt DeployPages eine Live-URL zurück, die Sie sofort zum Testen oder Teilen nutzen können.

Option 2: CLI-Workflow

Nützlich, wenn derselbe Build wiederholt veröffentlicht wird und der Veröffentlichungsschritt in Skript, CI-Job oder Release-Checkliste gehört.

Nutzen, wenn das Projekt wiederholbar ist

Drag and Drop passt für einmalige Vorschauen. Ein CLI-Flow passt, wenn ein Team denselben Ausgabeordner jedes Mal gleich veröffentlichen möchte.

CLI installieren

Installieren Sie die CLI global mit Ihrem Paketmanager.

npm install -g @deploypages/cli

Authentifizieren

Führen Sie den Login-Befehl aus und schließen Sie den browserbasierten Berechtigungsschritt ab.

deploypages login

Aktuellen Ordner veröffentlichen

Führen Sie den Befehl aus dem gebauten Ausgabeordner aus.

deploypages deploy

Framework-Builds vorbereiten

Moderne Frameworks brauchen vor dem Upload meist einen Build-Schritt. Ziel ist immer dasselbe: einfache statische Dateien erzeugen, die ein Browser direkt öffnen kann.

Was Build bedeutet

Ein Build verwandelt Framework-Quellen in veröffentlichbares HTML, CSS, JavaScript und Assets.

React / Vue / Vite

Command:npm run build
Output:dist/

Laden Sie den dist-Ordner selbst hoch, nicht den Projektwurzelordner.

Next.js Static Export

Command:npm run build
Output:out/

Setzen Sie output: 'export' in next.config.js, bevor Sie bauen.

Einfaches HTML

Command:Kein Build-Schritt nötig
Output:Ihr vorhandener Ordner

index.html sollte im Wurzelordner liegen.

Hugo / Hexo

Command:hugo oder hexo generate
Output:public/

Laden Sie den generierten public-Ordner hoch.

Next.js Exportbeispiel

next.config.js
/** @type {import('next').NextConfig} */const nextConfig = {  output: 'export',  images: { unoptimized: true },};
module.exports = nextConfig;

Grenzen des Static Export

Serverseitige Features wie API Routes, getServerSideProps und Middleware sind in einem statischen Export-Build nicht verfügbar.

Eigene Domains

DeployPages kann nach dem ersten Deployment Ihre eigene Domain verbinden, damit ein Projekt von der System-URL zu einer Markenadresse wechselt.

Was zählt als Domain?

Jede Domain, die Sie bei einem Registrar verwalten, kann funktionieren, solange Sie DNS-Einträge bearbeiten können.

Schritt 1: Domain in der Konsole hinzufügen

Gehen Sie zu den Projekteinstellungen, öffnen Sie Domains und fügen Sie den Hostnamen hinzu, den Sie verbinden möchten.

Schritt 2: DNS konfigurieren

DeployPages zeigt die DNS-Ziele für Inhaberschaftsprüfung und Traffic-Routing an.

Schritt 3: Verifizierung und HTTPS abwarten

Sobald DNS sichtbar ist, wird der Domain-Status gesund und HTTPS kann aktiviert werden.

TypHostWertZweck
CNAMEwwwcname.deploypages.siteTraffic zur Plattform leiten
TXTdeploypages-challengedeploypages-verify=...Domain-Inhaberschaft bestätigen

Host-Eintrag wählen

  • Verwenden Sie www, wenn Sie www.example.com verbinden.
  • Verwenden Sie @, wenn Sie die Root-Domain example.com verbinden.
  • Verwenden Sie ein Subdomain-Label wie blog, wenn Sie blog.example.com verbinden.

Website aktualisieren

Gleicher Workflow, neue Version

Ein Update nutzt dieselbe Logik wie das erste Deployment: neueste Ausgabe bauen, hochladen und die Plattform die Live-Version ersetzen lassen.
  • 1
    Quelldateien bearbeiten

    Ändern Sie Texte, Styles, Medien oder Assets lokal.

  • 2
    Bei Bedarf neu bauen

    Wenn das Projekt ein Framework nutzt, erzeugen Sie zuerst einen neuen Build-Ausgabeordner.

  • 3
    Projektkonsole öffnen

    Öffnen Sie die Projektseite in DeployPages.

  • 4
    Neue Version hochladen

    Ersetzen Sie den vorherigen Build durch den neuesten Ordner. Der Versionsverlauf hält die Veröffentlichung nachvollziehbar.

Sobald der Upload abgeschlossen ist, wird der neue Build live und frühere Versionen bleiben für Rollback verfügbar.

Häufige Fragen

Können Nicht-Entwickler DeployPages nutzen?
Ja. Wenn die Website bereits als statische Dateien exportiert wurde, reicht Drag-and-Drop-Deployment.
Warum sehe ich nach dem Deployment einen 404?
Der häufigste Grund ist eine fehlende oder falsch platzierte index.html. Stellen Sie sicher, dass die Einstiegdatei im Wurzelordner des Uploads liegt.
Was, wenn React- oder Vue-Routen nach Refresh brechen?
DeployPages unterstützt SPA-Fallback für gängige statische Frontend-Setups. Der Build muss trotzdem korrekt exportiert und vollständig hochgeladen werden.
Kann ich Videos oder größere Assets hochladen?
Ja. Für gute Performance sollten sehr große Medien aber optimiert oder über einen passenden spezialisierten Auslieferungspfad bereitgestellt werden.
Kann ich eine Seite mit Passwort schützen?
Ja, in Tarifen mit Passwortschutz. Nutzen Sie ihn für Vorschauen, interne Docs oder gestaffelte Launches.
Zu Explore