Files
portfolio/DIRECTUS_CHECKLIST.md
2026-01-22 20:56:35 +01:00

270 lines
8.9 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# Directus CMS Eingabe-Checkliste
## Collections und Struktur
Du hast zwei Collections in Directus:
1. **messages** kurze UI-Texte (Keys mit Werten)
2. **content_pages** längere Abschnitte (Slug mit Rich Text)
---
## Collection: messages
Alle folgenden Einträge in Directus anlegen. Format:
| key | locale | value |
### Navigation & Header
```
nav.home | en | Home
nav.home | de | Startseite
nav.about | en | About
nav.about | de | Über mich
nav.projects | en | Projects
nav.projects | de | Projekte
nav.contact | en | Contact
nav.contact | de | Kontakt
```
### Footer
```
footer.role | en | Software Engineer
footer.role | de | Software Engineer
footer.madeIn | en | Made in Germany
footer.madeIn | de | Made in Germany
footer.legalNotice | en | Legal notice
footer.legalNotice | de | Impressum
footer.privacyPolicy | en | Privacy policy
footer.privacyPolicy | de | Datenschutz
footer.privacySettings| en | Privacy settings
footer.privacySettings| de | Datenschutz-Einstellungen
footer.privacySettingsTitle | en | Show privacy settings banner again
footer.privacySettingsTitle | de | Datenschutz-Banner wieder anzeigen
footer.builtWith | en | Built with
footer.builtWith | de | Built with
```
### Home Hero
```
home.hero.features.f1 | en | Next.js & Flutter
home.hero.features.f1 | de | Next.js & Flutter
home.hero.features.f2 | en | Docker Swarm & CI/CD
home.hero.features.f2 | de | Docker Swarm & CI/CD
home.hero.features.f3 | en | Self-Hosted Infrastructure
home.hero.features.f3 | de | Self-Hosted Infrastruktur
```
### Home About
```
home.about.title | en | About Me
home.about.title | de | Über mich
home.about.techStackTitle | en | My Tech Stack
home.about.techStackTitle | de | Mein Tech Stack
home.about.hobbiesTitle | en | When I'm Not Coding
home.about.hobbiesTitle | de | Wenn ich nicht code
home.about.currentlyReading.title | en | Currently Reading
home.about.currentlyReading.title | de | Aktuell am Lesen
home.about.currentlyReading.progress | en | Progress
home.about.currentlyReading.progress | de | Fortschritt
```
### Home Projects (List)
```
home.projects.title | en | Selected Works
home.projects.title | de | Ausgewählte Projekte
home.projects.subtitle | en | A collection of projects I've worked on...
home.projects.subtitle | de | Eine Auswahl an Projekten, an denen ich gearbeitet habe...
home.projects.featured | en | Featured
home.projects.featured | de | Hervorgehoben
home.projects.viewAll | en | View All Projects
home.projects.viewAll | de | Alle Projekte ansehen
```
### Home Contact
```
home.contact.title | en | Contact Me
home.contact.title | de | Kontakt
home.contact.subtitle | en | Interested in working together...
home.contact.subtitle | de | Du willst zusammenarbeiten...
home.contact.getInTouch | en | Get In Touch
home.contact.getInTouch | de | Melde dich
home.contact.getInTouchBody | en | I'm always available to discuss...
home.contact.getInTouchBody | de | Ich bin immer offen für neue Chancen...
home.contact.info.email | en | Email
home.contact.info.email | de | E-Mail
home.contact.info.location | en | Location
home.contact.info.location | de | Ort
home.contact.info.locationValue | en | Osnabrück, Germany
home.contact.info.locationValue | de | Osnabrück, Deutschland
```
### Common
```
common.backToHome | en | Back to Home
common.backToHome | de | Zurück zur Startseite
common.backToProjects | en | Back to Projects
common.backToProjects | de | Zurück zu den Projekten
common.viewAllProjects | en | View All Projects
common.viewAllProjects | de | Alle Projekte ansehen
common.loading | en | Loading...
common.loading | de | Lädt...
```
### Projects List
```
projects.list.title | en | My Projects
projects.list.title | de | Meine Projekte
projects.list.intro | en | Explore my portfolio...
projects.list.intro | de | Stöbere durch mein Portfolio...
projects.list.searchPlaceholder | en | Search projects...
projects.list.searchPlaceholder | de | Projekte durchsuchen...
projects.list.all | en | All
projects.list.all | de | Alle
projects.list.noResults | en | No projects found...
projects.list.noResults | de | Keine Projekte passen...
projects.list.clearFilters | en | Clear filters
projects.list.clearFilters | de | Filter zurücksetzen
```
### Projects Detail
```
projects.detail.links | en | Project Links
projects.detail.links | de | Projektlinks
projects.detail.liveDemo | en | Live Demo
projects.detail.liveDemo | de | Live-Demo
projects.detail.liveNotAvailable | en | Live demo not available
projects.detail.liveNotAvailable | de | Keine Live-Demo verfügbar
projects.detail.viewSource | en | View Source
projects.detail.viewSource | de | Quellcode ansehen
projects.detail.techStack | en | Tech Stack
projects.detail.techStack | de | Tech-Stack
```
### Consent & Privacy
```
consent.title | en | Privacy settings
consent.title | de | Datenschutz-Einstellungen
consent.description | en | We use optional services...
consent.description | de | Wir nutzen optionale Dienste...
consent.essential | en | Essential
consent.essential | de | Essentiell
consent.analytics | en | Analytics
consent.analytics | de | Analytics
consent.chat | en | Chatbot
consent.chat | de | Chatbot
consent.alwaysOn | en | Always on
consent.alwaysOn | de | Immer aktiv
consent.acceptAll | en | Accept all
consent.acceptAll | de | Alles akzeptieren
consent.acceptSelected | en | Accept selected
consent.acceptSelected | de | Auswahl akzeptieren
consent.rejectAll | en | Reject all
consent.rejectAll | de | Alles ablehnen
consent.hide | en | Hide
consent.hide | de | Ausblenden
```
---
## Collection: content_pages
Diese sind für **längere Inhalte**. Nutze den Rich-Text-Editor in Directus oder Markdown.
### Home Hero (langere Beschreibung)
- **slug**: home-hero
- **locale**: en / de
- **title** (optional): Hero Section Description
- **content**: Längerer Text/Rich Text (ersetzen die kurze beschreibung)
Beispiel EN:
> "I'm a passionate software engineer and self-hoster from Osnabrück, Germany. I build full-stack web applications with Next.js, create mobile solutions with Flutter, and love exploring DevOps. I run my own infrastructure and automate deployments with CI/CD."
Beispiel DE:
> "Ich bin ein leidenschaftlicher Softwareentwickler und Self-Hoster aus Osnabrück. Ich entwickle Full-Stack Web-Apps mit Next.js, mobile Apps mit Flutter und bin begeistert von DevOps. Ich betreibe meine eigene Infrastruktur und automatisiere Deployments."
### Home About (längere Inhalte)
- **slug**: home-about
- **locale**: en / de
- **content**: Längerer Fließtext über mich
### Home Projects Intro
- **slug**: home-projects
- **locale**: en / de
- **content**: Intro-Text vor der Projekt-Liste
### Home Contact Intro
- **slug**: home-contact
- **locale**: en / de
- **content**: Intro vor dem Kontakt-Formular
---
## Wie du es in Directus eingeben kannst:
### Schritt 1: messages Collection
1. Gehe in Directus → **messages**.
2. Klick "Create New" (oder "+").
3. Füll aus:
- **key**: z. B. "nav.home"
- **locale**: Dropdown → "en" oder "de"
- **value**: Der Text (z. B. "Home")
4. Speichern. Wiederholen für alle Keys oben.
### Schritt 2: content_pages Collection
1. Gehe in Directus → **content_pages**.
2. Klick "Create New".
3. Füll aus:
- **slug**: z. B. "home-hero"
- **locale**: "en" oder "de"
- **title** (optional): "Hero Section" oder leer
- **content**: Markdown/Rich Text eingeben
4. Speichern. Wiederholen für andere Seiten.
---
## Im Code: Texte nutzen
### Kurze Keys (aus messages):
```tsx
import { getLocalizedMessage } from '@/lib/i18n-loader';
const text = await getLocalizedMessage('nav.home', locale);
// text = "Home" (oder fallback aus JSON)
```
### Längere Inhalte (aus content_pages):
```tsx
import { getLocalizedContent } from '@/lib/i18n-loader';
const page = await getLocalizedContent('home-hero', locale);
// page.content = "Längerer Fließtext..."
```
---
## Quick-Test:
1. Lege in Directus **einen** Key in messages an:
- key: "test"
- locale: "en"
- value: "Hello from Directus"
2. Im Code:
```tsx
const text = await getLocalizedMessage('test', 'en');
console.log(text); // sollte "Hello from Directus" loggen
```
3. Wenn das funktioniert: Alle anderen Keys eintragen!
---
## Hinweise:
- **Keys** sollten mit `.` strukturiert sein (z. B. `nav.home`, `home.about.title`).
- **Locale** ist immer "en" oder "de" (enum).
- **Fallback**: Wenn ein Key in Directus fehlt, nutzt der Code die `messages/*.json` Dateien.
- **Caching**: Texte werden 5 Minuten gecacht. Um Cache zu leeren: `clearI18nCache()` im Code oder Server restart.
- **Rich Text**: Im `content_pages` Feld kannst du Markdown oder den Rich-Text-Editor nutzen.
Viel Spaß! 🚀