Mit KI entwickeln

KI-Editoren und Coding-Agenten liegen bei sitelo oft daneben: Sie greifen zu Mustern aus React, Next oder Astro, die hier nicht passen. Diese Anleitung zeigt, wie du sie auf die aktuelle sitelo-Dokumentation lenkst und generierten Code beim richtigen Modell hältst.

llms.txt

sitelo veröffentlicht unter sitelo.dev/llms.txt eine maschinenlesbare Zusammenfassung des Frameworks. Viele Agenten können eine URL abrufen; bitte deinen darum, diese Datei (und die Doku für Menschen) zu lesen, bevor er sitelo-Code schreibt.

https://sitelo.dev/llms.txt — API und Konventionen in kompakter Form
https://sitelo.dev/de/docs — vollständige Anleitungen
README auf GitHub — Denkmodell und Funktionsüberblick
https://ht.js.org — Dokumentation zu javascript-to-html (empfohlen, um HTML in JS zu schreiben)

Anders als ein Doku-MCP-Server braucht llms.txt keine Installation — füge die URL in den Chat ein, nimm sie in die Projektregeln auf, oder lass den Agenten sie abrufen.

Projektregeln

Wenn dein Werkzeug dauerhafte Anweisungen unterstützt (AGENTS.md, Cursor-Regeln, Copilot-Instructions, …), ergänze eine kurze sitelo-Regel, damit jede Sitzung mit dem richtigen Denkmodell startet. Das Basis-Beispiel enthält eine AGENTS.md zum Kopieren:

# sitelo

Dieses Projekt verwendet [sitelo](https://sitelo.dev) — einen Vite-basierten Generator für statische Websites.

## Regeln

- Seiten sind Module unter `src/` mit Endungen wie `.ht.js` / `.ht.ts` / `.ht.jsx`, die **eine Default-Funktion (oder einen String) exportieren, die HTML zurückgibt**.
- Führe **kein** React, Next.js, Astro oder Komponenten-/Hydration-Framework ein, sofern der Nutzer nicht ausdrücklich danach fragt.
- Das Routing basiert auf Dateien: `about.ht.js` → `/about`, `[slug].ht.js` → dynamisch (nutze `generateStaticParams` für `sitelo build`).
- Lade Daten mit `export async function data(ctx)`. Nutze `fetchWithCache` aus `sitelo` für gecachtes HTTP. Lokales JSON liest du mit `readJson` / `readJsonCollection` aus `sitelo/data`.
- Nur aus dem HTML referenziertes JS/CSS landet in `dist/`. Lass Server-Code unreferenziert, damit er nie ausgeliefert wird.
- Die Konfiguration liegt in `sitelo.config.js`. Vite-Optionen gehören unter `vite`.
- Befehle: `sitelo` (dev), `sitelo build`, `sitelo preview`.
- Für aktuelle APIs lies https://sitelo.dev/llms.txt und https://sitelo.dev/docs — erfinde keine APIs aus anderen Frameworks.
- Bevorzuge [javascript-to-html](https://ht.js.org) (`ht.js`) für Markup: Tag-Funktionen, die HTML-Strings zurückgeben. Docs: https://ht.js.org

Cursor

Lege .cursor/rules/sitelo.mdc in deinem Projekt an (oder füge denselben Text in Cursors Oberfläche für Projektregeln ein):

---
description: sitelo-Konventionen für statische Websites
alwaysApply: true
---

# sitelo

Seiten sind `.ht.js`-Module (usw.), die HTML-Strings zurückgeben — keine React-/Next-/Astro-Komponenten.
Bevorzuge javascript-to-html (https://ht.js.org) für Markup. Nutze dateibasiertes Routing, `data()` und `sitelo build`.
Konsultiere https://sitelo.dev/llms.txt für die sitelo-APIs.

Tipps für KI-gestützte sitelo-Arbeit

Starte von einer Vorlage — lass den Agenten das Gerüst aus examples/basic oder examples/wordpress erzeugen, statt ein Framework zu erfinden.
Bevorzuge javascript-to-html (ht.js) fürs Markup — Tag-Funktionen, die HTML-Strings zurückgeben, ohne Template-Engine und ohne React. Verweise Agenten auf ht.js.org, damit sie keine JSX-Komponentenbäume erfinden.
Seiten sind Funktionen, die HTML zurückgeben — export default () => `<html>…</html>` oder zusammengesetzt mit javascript-to-html. JSX ist in Ordnung, solange es zu Strings kompiliert; eine React-Runtime ist nicht nötig.
Nutze die sitelo-CLI — sitelo / sitelo build — statt vite direkt, sofern du nicht sicher eine eigene Vite-Konfiguration brauchst.
Prüfe APIs gegen llms.txt — besonders generateStaticParams, fetchWithCache und Server-Islands.
Null JS von Haus aus — binde nur dann ein <script> ein, wenn die Seite Client-Code braucht; nicht referenzierte Module bleiben serverseitig.
Prüfen und ausführen — starte nach jeder Änderung des Agenten an Seiten immer sitelo build (oder den Entwicklungsserver); behandle generiertes Markup als Entwurf.

Erste Schritte · Basis-Beispiel · llms.txt