Website + Bewerbungs-Postfach live deployed auf Cloudflare Workers (dogfather-universe.dogfather1608.workers.dev)
This commit is contained in:
@@ -1,92 +1,78 @@
|
||||
# DOGFATHER UNIVERSE — Go-Live-Anleitung
|
||||
|
||||
Diese Website ist rein statisch (HTML/CSS/JS) — sobald eine Domain feststeht, ist „online stellen"
|
||||
nur noch eine Frage von ein paar Klicks/Befehlen, kein Code-Umbau nötig. Diese Datei ist die
|
||||
Checkliste dafür.
|
||||
## ✅ Status: bereits live
|
||||
|
||||
## 1. Domain-Platzhalter ersetzen (einmalig, sobald Domain feststeht)
|
||||
Die Website läuft schon — kostenlos, sofort teilbar, auf deinem eigenen Cloudflare-Account:
|
||||
|
||||
An folgenden Stellen steht aktuell `REPLACE-WITH-YOUR-DOMAIN.tld` als Platzhalter:
|
||||
- **Website:** https://dogfather-universe.dogfather1608.workers.dev
|
||||
- **Bewerbungs-Postfach-Worker:** https://dogfather-universe-postfach.dogfather1608.workers.dev
|
||||
|
||||
- `sitemap.xml` (alle `<loc>`-Einträge)
|
||||
- `robots.txt` (Sitemap-Zeile)
|
||||
- in **jeder** `.html`-Datei: `og:url`, `og:image`, `twitter:image` (im `<head>`)
|
||||
Beide laufen als Cloudflare Worker (Static Assets + API-Worker), im kostenlosen Free-Tier. Du
|
||||
kannst den Link zur Website ab sofort verschicken. Sobald du eine eigene Domain hast, ist der
|
||||
Umzug dorthin reine Konfiguration — kein Code-Umbau, kein erneutes Deployen von Grund auf.
|
||||
|
||||
Am schnellsten mit Suchen-&-Ersetzen im Editor, oder per Terminal (im Ordner `DogFather-Website/`):
|
||||
## Eigene Domain anschließen (sobald vorhanden)
|
||||
|
||||
```bash
|
||||
# Beispiel mit echter Domain (macOS/Linux/Git-Bash):
|
||||
find . -type f \( -name "*.html" -o -name "*.xml" -o -name "*.txt" \) \
|
||||
-exec sed -i 's/REPLACE-WITH-YOUR-DOMAIN.tld/deine-domain.de/g' {} +
|
||||
```
|
||||
1. Im [Cloudflare-Dashboard](https://dash.cloudflare.com) → **Workers & Pages** →
|
||||
`dogfather-universe` → Tab **Settings → Domains & Routes** → **Add** → eigene Domain eintragen.
|
||||
Läuft die Domain schon über Cloudflare, ist das in der Regel sofort aktiv (automatisches HTTPS).
|
||||
2. Domain-Platzhalter im Code ersetzen (nur relevant für Social-Media-Vorschaubilder, nicht für
|
||||
die Funktion der Seite selbst — die läuft so oder so):
|
||||
|
||||
## 2. Social-Preview-Bild ergänzen (optional, aber empfohlen)
|
||||
```bash
|
||||
cd DogFather-Website
|
||||
find . -type f \( -name "*.html" -o -name "*.xml" -o -name "*.txt" \) \
|
||||
-exec sed -i 's/REPLACE-WITH-YOUR-DOMAIN.tld/deine-domain.de/g' {} +
|
||||
npx wrangler deploy
|
||||
```
|
||||
3. Optional: Social-Preview-Bild `assets/img/og-cover.jpg` (1200×630px) ergänzen.
|
||||
4. CORS enger fassen: in `cloudflare-worker/src/worker.js` → `corsHeaders()` die eigene Domain statt
|
||||
`"*"` eintragen, dann `cd cloudflare-worker && npx wrangler deploy`.
|
||||
|
||||
`assets/img/og-cover.jpg` (1200×630px) anlegen — erscheint als Vorschaubild, wenn Links z.B. bei
|
||||
TikTok, WhatsApp oder Discord geteilt werden. Bis dahin zeigen Plattformen einfach kein Bild an,
|
||||
nichts bricht.
|
||||
## Änderungen künftig live schalten
|
||||
|
||||
## 3. Bewerbungs-Postfach deployen (falls noch nicht geschehen)
|
||||
|
||||
Siehe `cloudflare-worker/README.md`. Danach die Worker-URL eintragen in:
|
||||
- `assets/js/forms.js` → `API_BASE_URL`
|
||||
- `postfach.html` → `API_BASE_URL`
|
||||
|
||||
## 4. Hosting wählen & deployen
|
||||
|
||||
Alle drei Optionen sind kostenlos im Free-Tier und unterstützen automatisch HTTPS +
|
||||
Custom-Domains. Empfehlung: **Cloudflare Pages**, weil das Bewerbungs-Postfach schon auf
|
||||
Cloudflare läuft — dann liegt alles in einem Account.
|
||||
|
||||
### Option A — Cloudflare Pages (empfohlen)
|
||||
Jede Änderung an den Dateien im Ordner `DogFather-Website/` wird erst live, wenn erneut deployed
|
||||
wird:
|
||||
|
||||
```bash
|
||||
cd DogFather-Website
|
||||
npx wrangler pages deploy . --project-name=dogfather-universe
|
||||
npx wrangler deploy
|
||||
```
|
||||
|
||||
Danach im Cloudflare-Dashboard unter **Workers & Pages → dogfather-universe → Custom domains**
|
||||
die eigene Domain hinzufügen (DNS läuft automatisch über Cloudflare, wenn die Domain dort
|
||||
verwaltet wird).
|
||||
Für Änderungen am Bewerbungs-Postfach-Worker selbst (`cloudflare-worker/src/worker.js`):
|
||||
|
||||
### Option B — Netlify
|
||||
```bash
|
||||
cd DogFather-Website/cloudflare-worker
|
||||
npx wrangler deploy
|
||||
```
|
||||
|
||||
1. Auf [netlify.com](https://netlify.com) einloggen (kostenloser Account reicht)
|
||||
2. „Add new site" → „Deploy manually" → den Ordner `DogFather-Website/` per Drag&Drop hochladen
|
||||
(oder Repo verbinden, falls die Seite auf GitHub liegt)
|
||||
3. `netlify.toml` wird automatisch erkannt (liegt schon bereit)
|
||||
4. Unter **Site settings → Domain management** die eigene Domain hinzufügen
|
||||
## Alternative Hosting-Optionen (falls du weg von Cloudflare willst)
|
||||
|
||||
### Option C — GitHub Pages
|
||||
Die Seite ist reines statisches HTML/CSS/JS und läuft überall. Configs liegen bereit:
|
||||
|
||||
1. Repo auf GitHub erstellen, Inhalt von `DogFather-Website/` pushen (siehe Abschnitt 5)
|
||||
2. Im Repo unter **Settings → Pages** → Branch `main`, Ordner `/ (root)` auswählen
|
||||
3. Datei `.nojekyll` liegt schon bereit (verhindert, dass GitHub Dateien wie `_headers`
|
||||
fälschlich ignoriert)
|
||||
4. Unter **Settings → Pages → Custom domain** die eigene Domain eintragen — GitHub legt dafür
|
||||
automatisch eine `CNAME`-Datei im Repo an
|
||||
- **Netlify:** `netlify.toml` liegt vor — Ordner `DogFather-Website/` auf netlify.com hochladen
|
||||
oder Repo verbinden.
|
||||
- **GitHub Pages:** `.nojekyll` liegt vor — Repo pushen, unter **Settings → Pages** aktivieren.
|
||||
|
||||
## 5. Git-Repo einrichten (falls noch nicht geschehen)
|
||||
In beiden Fällen bleibt der Bewerbungs-Postfach-Worker unabhängig auf Cloudflare bestehen (er ist
|
||||
eine reine API, kein Teil des Frontends) — `API_BASE_URL` in `assets/js/forms.js`, `index.html`
|
||||
und `postfach.html` zeigt bereits dorthin.
|
||||
|
||||
## Git-Repo
|
||||
|
||||
Bereits eingerichtet (`DogFather-Website/.git`), erster Commit vorhanden. Bei Bedarf zu GitHub
|
||||
pushen:
|
||||
|
||||
```bash
|
||||
cd DogFather-Website
|
||||
git init
|
||||
git add .
|
||||
git commit -m "DOGFATHER UNIVERSE — erste lauffähige Version"
|
||||
git branch -M main
|
||||
git remote add origin <repo-url>
|
||||
git push -u origin main
|
||||
```
|
||||
|
||||
`.gitignore` ist bereits vorbereitet (schließt z.B. Wrangler-Cache aus).
|
||||
## Nach jedem Go-Live-Schritt prüfen
|
||||
|
||||
## 6. Nach dem Go-Live prüfen
|
||||
|
||||
- [ ] Alle Seiten über die echte Domain aufrufbar (nicht nur `index.html`, auch Unterseiten)
|
||||
- [ ] `https://deine-domain.de/robots.txt` und `/sitemap.xml` erreichbar
|
||||
- [ ] Bewerbungsformular sendet erfolgreich (Postfach zeigt neue Einträge)
|
||||
- [ ] Link-Vorschau testen, z.B. mit dem
|
||||
[Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/) oder
|
||||
[Twitter Card Validator](https://cards-dev.twitter.com/validator)
|
||||
- [ ] In `cloudflare-worker/src/worker.js` → `corsHeaders()` `"*"` durch die echte Domain
|
||||
ersetzen und den Worker neu deployen (`wrangler deploy`)
|
||||
- [ ] Website lädt: https://dogfather-universe.dogfather1608.workers.dev
|
||||
- [ ] Bewerbungsformular sendet erfolgreich (im Postfach zeigt sich ein neuer Eintrag)
|
||||
- [ ] Live-Punkt auf der Startseite reagiert auf den Toggle im Postfach
|
||||
- [ ] Nach Domain-Wechsel: Link-Vorschau testen, z.B. mit dem
|
||||
[Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/)
|
||||
|
||||
Reference in New Issue
Block a user