d3bcf718ae
Setup project structure with React, Tailwind CSS, and TypeScript for a multi-theme portfolio application. Includes mock data definitions, environment configuration, and Vite build tooling.
92 lines
5 KiB
Markdown
92 lines
5 KiB
Markdown
# 📚 Dual Identity Autoren-Zentrale (Selbstgehostet)
|
|
|
|
Willkommen in Ihrer modernen, reaktiven Autoren-Website für das 21. Jahrhundert! Dieses System ermöglicht es Ihnen, zwei völlig eigenständige Autorenprofile mit individuellen Themen, Biografien, Schreibprojekten und Bücherregalen über eine einzige, passwortgeschützte Administrationsoberfläche zu pflegen.
|
|
|
|
---
|
|
|
|
## 🛠️ Warum kein klassischer LAMP-Stack? (Unser Vorschlag)
|
|
|
|
Bisher liefen klassische Portfolios oft auf einem standardmäßigen **LAMP-Stack** (Linux, Apache, MySQL, PHP). Für diese modernisierte Website schlagen wir einen **Node.JS + Docker-Stack** vor. Hier ist der Grund, warum das für Ihre Bedürfnisse die deutlich bessere Option ist:
|
|
|
|
1. **Vollständige Kapselung (Kein Server-Wildwuchs):** Bei einem LAMP-Stack müssen Sie Apache/Nginx, PHP-Laufzeiten und eine MySQL-Datenbank auf dem Host installieren und managen. Unser Docker-Stack bündelt das gesamte Frontend, das Express-Backend und die Speicherrelevanz in einem **einzigen, autarken Container**.
|
|
2. **Blitzschnelle, reaktive Benutzeroberfläche (SPA):** Das Frontend nutzt modernste Webtechnologie (React & Tailwind CSS). Seitenwechsel und Buchdetails laden augenblicklich im Browser des Nutzers, ohne das klassische, träge Neuladen von PHP-Seiten.
|
|
3. **Einfachheit bei Datensicherungen (Backups):** Anstatt komplexe MySQL-Dumps durchzuführen, speichert unsere Anwendung alle Buchtitel, Projekte, Cover und Biografien in einer schlanken, robusten JSON-Datenbankdatei (`/data/database.json`). Ein Backup lässt sich durch einfaches Kopieren dieser Datei anfertigen!
|
|
4. **KI-Unterstützung integriert:** Der integrierte **Gemini-Klappentext-Assistent** läuft nahtlos und sicher über das Node-Backend (ohne API-Schlüssel im Webbrowser zu exponieren).
|
|
|
|
---
|
|
|
|
## 🌌 Die Trennung der Profile
|
|
|
|
Das System ist von Grund auf so strukturiert, dass Besucher der Website **keine Verbindung** zwischen Ihren beiden Identitäten herstellen können:
|
|
- **Echte Identität (Daniel Hesse — Sci-Fi & Fantasy):** Erreichbar auf der Standard-Startseite (`/`). Das Design kombiniert dunkelblaue Weltraum-Energie, Monospace-Einflüsse und kosmische Magie-Akzente.
|
|
- **Pseudonym (M. S. Velvet — Sinnliche Literatur):** Erreichbar **ausschließlich** über den Pfad `/sensual-moments`. Sie verwendet ein warmes, edles "Champagner-Gold & Samt-Bordeaux"-Thema mit klassischer und anspruchsvoller Serif-Asthetik. Es gibt keinerlei gegenseitige Verlinkungen!
|
|
|
|
---
|
|
|
|
## 🚀 Inbetriebnahme als Docker-Stack (Empfohlen)
|
|
|
|
Es wird dringend empfohlen, die Website mithilfe von **Docker und Docker-Compose** zu betreiben. Dies garantiert, dass die Anwendung sofort und unabhängig von installierten Node.JS-Versionen auf Ihrem Server funktioniert.
|
|
|
|
### 1. Dateien vorbereiten
|
|
Stellen Sie sicher, dass sich folgende Dateien im gleichen Ordner auf Ihrem Server befinden:
|
|
- `Dockerfile`
|
|
- `docker-compose.yml`
|
|
- Der gesamte Code-Ordner
|
|
|
|
### 2. Konfiguration anpassen
|
|
Öffnen Sie die `docker-compose.yml` auf Ihrem Server und passen Sie folgende Umgebungsvariablen an:
|
|
```yaml
|
|
environment:
|
|
- NODE_ENV=production
|
|
# Das Passwort für Ihren Administrationsbereich (/admin):
|
|
- ADMIN_PASSWORD=IhrSicheresLieblingsPasswort123
|
|
# (Optional) Für den 21. Jahrhundert Schreibassistenten (Gemini 3.5 Flash)
|
|
- GEMINI_API_KEY=Ihr_Gemini_API_Schluessel
|
|
```
|
|
|
|
### 3. Container starten
|
|
Führen Sie im entsprechenden Verzeichnis folgenden Befehl aus:
|
|
```bash
|
|
docker compose up -d --build
|
|
```
|
|
Die Anwendung baut das Image und startet die Autoren-Zentrale im Hintergrund. Sie ist nun direkt auf Port **`3000`** Ihres Webservers erreichbar!
|
|
|
|
#### Reverse Proxy Tipp:
|
|
Sie können ganz hervorragend einen Reverse Proxy wie **Nginx Proxy Manager**, **Traefik** oder **Caddy** davorhängen, um SSL-Zertifikate (Let's Encrypt) zuzuweisen und Ihre Domain auf den Container-Port `3000` umzuleiten.
|
|
|
|
---
|
|
|
|
## 💾 Manuelle Installation ohne Docker (Alternativ)
|
|
|
|
Sollten Sie die Software direkt auf Ihrem Server (ohne Docker) starten wollen:
|
|
|
|
1. **Voraussetzung:** Installieren Sie **Node.js** (v18 oder neuer) auf Ihrem Linux- oder Windows-Server.
|
|
2. **Abhängigkeiten installieren:**
|
|
```bash
|
|
npm install
|
|
```
|
|
3. **Produktions-Build ausführen:**
|
|
```bash
|
|
npm run build
|
|
```
|
|
4. **Umgebungsvariablen setzen:**
|
|
Erstellen Sie eine `.env`-Datei oder exportieren Sie diese im Terminal:
|
|
```bash
|
|
export ADMIN_PASSWORD="IhrSicheresPasswort"
|
|
export GEMINI_API_KEY="Ihr_Gemini_API_Schlüssel"
|
|
```
|
|
5. **Starten:**
|
|
```bash
|
|
npm start
|
|
```
|
|
|
|
---
|
|
|
|
## 🧱 Datensicherung / Backups
|
|
|
|
Alle Ihre wertvollen Inhalte (Biografien, Projektfortschritte und alle Bücherregal-Einträge) liegen verschlüsselt strukturiert in Ihrem Projektordner unter:
|
|
`./data/database.json`
|
|
|
|
Da wir in der `docker-compose.yml` ein **lokales Volume** gemountet haben (`./data:/app/data`), wird diese Datei direkt auf die Festplatte Ihres Servers geschrieben.
|
|
- **Backup erstellen:** Sichern Sie einfach die Datei `./data/database.json`.
|
|
- **Wiederherstellen:** Platzieren Sie eine gesicherte `database.json` in den `./data/`-Ordner vor dem Starten des Containers.
|