Back to Blog

Website-Struktur im Mai 2026

Eine aktualisierte Momentaufnahme der Website: was inzwischen live dazugehört, wie der statische Aufbau gewachsen ist und wie Branches und Worktrees die Arbeit daran ordnen.

Die Startstruktur aus website-aufbau.html wird nicht nachträglich aktualisiert. Stattdessen dokumentiert dieser Beitrag den aktuellen Ausbau als neuen Stand.

Warum ein neuer Strukturbeitrag?

In website-aufbau.html war die Website noch ein kleiner statischer Startpunkt: ein paar Hauptseiten, ein Blogpost, zentrale Styles und wenig JavaScript. Das war genau richtig für den Anfang, aber die Struktur ist inzwischen weitergewachsen.

Es gibt mehr Blogbeiträge, eine Projektseite für Manga Vault, zusätzliche JavaScript-Dateien, neue Bilder und lokale Dokumentation. Würde ich den alten Strukturblock ständig überschreiben, wäre nicht mehr sichtbar, wie klein die Website gestartet ist. Deshalb bleibt der alte Ausschnitt historisch, und dieser Beitrag übernimmt die Rolle der aktualisierten Bestandsaufnahme.

Aktuelle Website-Struktur

Für die Website-Struktur ist der Live-Stand auf dem VPS entscheidend. Der Webroot bleibt /var/www/newwaves.dev/. Dort liegen die Dateien, die am Ende ausgeliefert werden. Die Website bleibt weiterhin statisch. 

/var/www/newwaves.dev/
├── index.html
├── about.html
├── projects.html
├── blog.html
├── assets/
│   ├── css/
│   │   └── style.css
│   └── js/
│       ├── ascii-globe.js
│       ├── blog-table-sort.js
│       └── code-windows.js
├── blog/
│   ├── ausbau-von-newwaves-dev.html
│   ├── fastfetch-windows-11.html
│   ├── git-deploy-workflow.html
│   ├── git-workflow-worktrees.html
│   ├── redesign-about-page.html
│   ├── vps-security-setup.html
│   └── website-aufbau.html
├── images/
│   └── projects/
│       └── manga-vault/
│           └── ranking/
└── projects/
    └── manga-vault.html

Lokale Projektunterlagen wie doku/ gehören nicht zu diesem Baum. Sie bleiben bewusst außerhalb des Live-Standes und werden nicht als Website-Inhalt behandelt.

Was sich seit dem Start verändert hat

Die wichtigste Veränderung ist, dass aus einer kleinen Website-Basis ein dokumentierter Arbeitsbereich geworden ist. Der Blog ist nicht mehr nur eine einzelne Notiz zum Aufbau, sondern sammelt inzwischen mehrere Themen: Deploy-Workflow, VPS-Security, Git-Worktrees, About-Redesign und Setup-Dokumentation.

  • blog.html ist zur sortierbaren Blogübersicht geworden.
  • projects.html führt auf eigene Projektseiten wie projects/manga-vault.html.
  • assets/js/code-windows.js macht Codeblöcke in Blogposts kopierbar.
  • assets/js/blog-table-sort.js sortiert Beiträge nach Aktualisierungsdatum.
  • assets/js/ascii-globe.js trägt die neue About-Seite mit dem rotierenden ASCII-Globus.
  • assets/css/style.css bleibt die zentrale Stelle für fast das gesamte Design.

Die Grundidee bleibt trotzdem dieselbe wie am Anfang: Die Website soll verständlich bleiben, wenn man den Projektordner öffnet. Jede wichtige Seite ist direkt auffindbar, und neue Inhalte brauchen keinen Generator, bevor sie im Browser funktionieren.

Branches

Neben der Dateistruktur ist inzwischen auch die Git-Struktur wichtiger geworden. main ist der stabile Hauptbranch. Der Branch claude existiert lokal für Arbeit in einem separaten Worktree. Auf GitHub ist aktuell vor allem origin/main relevant. 

new-waves/newwaves.dev
├── main
│   ├── lokal: ja
│   ├── remote: origin/main
│   └── Rolle: stabiler Hauptstand und Basis für Deployments
│
└── claude
    ├── lokal: ja
    ├── remote: aktuell nicht als origin/claude sichtbar
    └── Rolle: separater Arbeitsbranch für Claude Code

Diese Trennung ist bewusst einfach gehalten. Es gibt kein kompliziertes Branch-Modell mit vielen Ebenen. Der Hauptstand bleibt auf main, experimentelle oder parallele Agent-Arbeit kann im eigenen Branch landen und später kontrolliert gemerged werden.

Worktrees

Ein Branch ist nur die Entwicklungslinie. Der Worktree ist der konkrete lokale Ordner, in dem diese Entwicklungslinie ausgecheckt ist. Genau diese Trennung macht es möglich, dass Codex und Claude Code nicht denselben Arbeitsordner teilen müssen. 

C:\Users\user0\Desktop\Projekte
├── newwaves.dev
│   ├── Branch: main
│   ├── HEAD: 1ead6b3
│   └── Nutzung: Hauptordner für Codex, stabile Pflege und Blogarbeit
│
└── newwaves.dev-claude
    ├── Branch: claude
    ├── HEAD: de48dcb
    └── Nutzung: separater Arbeitsordner für Claude Code

Der praktische Vorteil ist weniger Magie und mehr Ordnung: Zwei Tools können am selben Repository arbeiten, aber in getrennten Ordnern. Konflikte entstehen dann nicht durch gleichzeitiges Schreiben im gleichen Dateisystemordner, sondern kontrolliert an Git-Grenzen wie Merge oder Rebase.

Deployment bleibt schlicht

Auch mit mehr Struktur bleibt der Deploy-Weg klein. Die Website wird lokal bearbeitet, nach GitHub gepusht und auf dem VPS per git pull aktualisiert. Der Live-Pfad bleibt /var/www/newwaves.dev. 

Workstation
└── C:\Users\user0\Desktop\Projekte\newwaves.dev
    └── git push

GitHub
└── new-waves/newwaves.dev
    └── origin/main

VPS
└── /var/www/newwaves.dev
    └── git pull

Für diese statische Website braucht es dabei weiterhin keinen Build und keinen Restart. Solange nur HTML, CSS, JavaScript und Bilder ausgeliefert werden, reicht der aktualisierte Dateistand im Webroot.

Was ich daraus mitnehme

Der Ausbau von newwaves.dev zeigt mir, warum Dokumentation direkt im Projekt wertvoll ist. Die Website wächst nicht nur durch neue Seiten, sondern auch durch bessere Arbeitsabläufe: Git statt SFTP, Worktrees statt gemeinsamem Ordner, Blogposts statt verstreuter Notizen.

Gleichzeitig bleibt der wichtigste Rahmen unverändert. Die Website soll nicht schwerer werden als nötig. Solange eine statische Struktur reicht, bleibt sie statisch. Neue Artikel wie dieser sind deshalb nicht nur Inhalt, sondern auch kleine Checkpoints: Was ist gerade da, warum ist es so aufgebaut, und an welcher Stelle kann es später sauber weiterwachsen?