147 lines
3.2 KiB
Markdown
147 lines
3.2 KiB
Markdown
# Website Skeleton
|
|
|
|
Minimalistisches Runtime-Skeleton für KI-generierte Websites.
|
|
|
|
---
|
|
|
|
## Was ist das?
|
|
|
|
Dieses Repository ist **kein Website-Template**. Es enthält:
|
|
|
|
- Keine fertigen Layouts
|
|
- Keine UI-Komponenten
|
|
- Keine Design-Vorgaben
|
|
|
|
Es ist ein neutraler, stabiler Arbeitscontainer, mit dem KI individuelle Websites von Grund auf generiert.
|
|
|
|
---
|
|
|
|
## Für KI-Systeme
|
|
|
|
**Vor der Website-Generierung müssen folgende Dateien gelesen werden:**
|
|
|
|
1. `/skills/SYSTEM_SKILLS.md` - Grundregeln und Verbote
|
|
2. `/skills/UI_GUIDELINES.md` - Qualitätsstandards
|
|
3. `/skills/DEFINITION_OF_DONE.md` - Abnahmekriterien
|
|
4. `/spec/ProjectSpec.json` - Projektspezifikation
|
|
5. `/spec/design_tokens.json` - Design-System
|
|
6. `/prompts/master_prompt.md` - Workflow-Anleitung
|
|
|
|
---
|
|
|
|
## Tech-Stack
|
|
|
|
| Kategorie | Technologie |
|
|
|-----------|-------------|
|
|
| Framework | Next.js 15+ (App Router) |
|
|
| UI | React 19 |
|
|
| Sprache | TypeScript |
|
|
| Styling | Tailwind CSS v4 |
|
|
| Animation | framer-motion, lenis |
|
|
| Icons | lucide-react |
|
|
| Runtime | Node.js 20.x LTS |
|
|
|
|
---
|
|
|
|
## Projektstruktur
|
|
|
|
```
|
|
/
|
|
├── app/ # Next.js App Router
|
|
├── components/ # Fundament-Komponenten
|
|
│ ├── layout/ # Container, Section
|
|
│ └── ui/ # Button, Card
|
|
├── src/ # Projekt-spezifischer Code (Utils, Hooks)
|
|
├── skills/ # KI-Regeln und Guidelines
|
|
├── spec/ # Projektspezifikation & Design Tokens
|
|
├── theme/ # CSS Variables & Stylesheets
|
|
├── prompts/ # KI-Prompts
|
|
├── content/ # Inhalte (MDX, JSON)
|
|
├── assets/ # Medien (Bilder, Fonts)
|
|
├── meta/ # Generierungs-Logs
|
|
├── docker/ # Docker-Konfiguration
|
|
└── [config files] # package.json, tsconfig.json, etc.
|
|
```
|
|
|
|
---
|
|
|
|
## Entwicklung
|
|
|
|
### Voraussetzungen
|
|
|
|
- Node.js 20.x oder höher
|
|
- npm
|
|
|
|
### Installation
|
|
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
### Development Server
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
Öffne [http://localhost:3000](http://localhost:3000).
|
|
|
|
### Production Build
|
|
|
|
```bash
|
|
npm run build
|
|
npm run start
|
|
```
|
|
|
|
---
|
|
|
|
## Docker
|
|
|
|
### Development
|
|
|
|
```bash
|
|
cd docker
|
|
docker-compose up
|
|
```
|
|
|
|
### Production Build
|
|
|
|
```bash
|
|
docker build -f docker/Dockerfile -t website .
|
|
docker run -p 3000:3000 website
|
|
```
|
|
|
|
---
|
|
|
|
## Workflow für neue Projekte
|
|
|
|
1. **Spec ausfüllen**: `spec/ProjectSpec.json` mit Projektdaten füllen
|
|
2. **Tokens anpassen**: `spec/design_tokens.json` mit Farben, Fonts etc.
|
|
3. **KI starten**: Mit Verweis auf `/skills` und `/spec`
|
|
4. **Generieren**: KI erstellt Website basierend auf Specs
|
|
5. **Prüfen**: Definition of Done validieren
|
|
6. **Deployen**: Build erstellen und ausliefern
|
|
|
|
---
|
|
|
|
## Entwicklungshinweise
|
|
|
|
> **Build und Dev dürfen nicht gleichzeitig laufen.**
|
|
> Next.js kann CSS-Referenzen verlieren, wenn `npm run build` und `npm run dev` parallel ausgeführt werden.
|
|
> Nutze `npm run clean` um den `.next` Cache zu löschen, falls Styling-Probleme auftreten.
|
|
|
|
---
|
|
|
|
## Wichtig
|
|
|
|
- Dieses Skeleton erzwingt **kein Design**
|
|
- Alle Werte in `design_tokens.json` sind **Platzhalter**
|
|
- Die KI **muss** die Skills lesen bevor sie Code generiert
|
|
- Jede Website wird **individuell** erstellt
|
|
|
|
---
|
|
|
|
## Lizenz
|
|
|
|
Proprietär - Nur für autorisierte Nutzung.
|