Mein Claude Code Setup ist jetzt Open Source: 40+ Skills, 18 Regeln, Safety Hooks

KI-Modelle werden auf dem Internet trainiert. Das Internet enthält reichlich minderwertigen, unsicheren und veralteten Code. Wer mit KI-Coding-Assistenten konsistent bessere Ergebnisse erzielen will, muss sie mit Werkzeugen und Anweisungen lenken.

Ich habe schnell festgestellt, dass eine einzelne CLAUDE.md-Datei nicht der richtige Ansatz ist, um alle Regeln und Techniken umzusetzen. Das Ökosystem hat bereits viele hervorragende Skills, Plugins und Hooks — aber sie sind über Dutzende Repositories, Marktplätze und Blog-Artikel verstreut. Sie zu finden, zu bewerten und zu kombinieren kostet Stunden.

Deshalb habe ich mein gesamtes Setup als kuratierte, sofort einsatzfähige Sammlung mit Installer Skript veröffentlicht: github.com/alpham8/claude-webdev

Was enthalten ist¶

Die Skills im Detail¶

Die Sammlung deckt meinen gesamten Technologie-Stack ab:

• Shopware 5 und 6 — Plugin-Architektur, DAL, Event-System, Admin-Komponenten, Storefront JS, DDEV-Setup, dustin/shopware-utils
• Symfony — Vollständige Framework-Abdeckung plus Projekt-Scaffolding-Blueprint (Vite, DDEV, i18n, CAPTCHA, Deployment)
• PHP — Modernes PHP 8.0–8.4, Strict Typing, Security (OWASP Top 10), PSR-Standards
• TypeScript — Typsystem, Generics, Utility Types, async Patterns, Decorators
• Vue 2/3 und Svelte 5 — Composition API, Runes, Stores, TypeScript-Integration
• Frontend Design — Animation Engineering (Timing, Easing, Springs), UI Audit und Redesign-Workflow (Anti-AI-Slop-Patterns)
• Accessibility — WCAG 2.1 AA Checklist, Keyboard-Navigation, ARIA, Formular-Accessibility

18 Coding-Regeln¶

Die Regeln sind als einzelne Dateien in rules/ organisiert und decken ab:

1. PSR-12 als universeller Style-Standard (auch für andere Sprachen)
2. Security (Non-Negotiable): Input-Validierung, Output-Escaping, CSRF, Rate Limiting
3. Striktes Typsystem: declare(strict_types=1), keine any-Types, kein empty()
4. Clean Code: Guard Clauses, Single Responsibility, keine Magic Numbers
5. Niedrige Komplexität: max. 5 pro Funktion, max. 4 Parameter
6. Wartbarkeit: Thin Controllers, DTOs an Boundaries, spezifische Exceptions
7. JS/TS Tooling: Prettier und ESLint mit PSR-12-Intent
8. Vue und Svelte: TypeScript als Source-Sprache, kein TS in Templates
9. Testing: Keine echten API-Calls in Unit-Tests, Definition of Done
10. Environment: DDEV-Container für alle PHP/Node-Befehle
11. Boundaries: Was immer tun, was fragen, was nie tun
12. Performance: Keine N+1 Queries, Index-Awareness, Lazy Loading
13. Datenbank und Migrations: Bidirektional, eine Aufgabe pro Migration
14. Dependencies: Existenz prüfen, einzeln updaten, nie bulk-updaten
15. Observability: Strukturiertes JSON-Logging, keine Secrets in Logs
16. Accessibility: WCAG 2.1 AA, semantisches HTML, Keyboard-Navigation
17. i18n: Key-basierte Translations, kein String-Concatenation
18. Git Workflow: Conventional Commits, Branch-Naming, kein Force-Push auf main

Safety Hooks¶

Die vier Hooks verhindern häufige Fehler automatisch:

• Format-on-Save — Code wird beim Speichern automatisch formatiert
• Static Analysis — PHPStan/ESLint laufen vor dem Commit
• Type Checking — TypeScript-Compiler prüft vor dem Build
• Destructive Command Guard — Warnung bei potenziell gefährlichen Befehlen

MCP-Server¶

Die settings.json konfiguriert fünf MCP-Server:

Installation¶

git clone https://github.com/alpham8/claude-webdev.git
cd claude-webdev
./install.sh

Der Installer kopiert alle Dateien nach ~/.claude und konfiguriert Claude Code für die sofortige Nutzung. Er funktioniert auf Linux und macOS.

Warum Open Source?¶

Ich nutze Claude Code täglich für Kundenprojekte. Die Qualität der KI-Ausgabe hängt direkt davon ab, wie gut die Anweisungen sind. Mit diesem Repository kann jeder PHP- und Webentwickler von meiner Konfiguration profitieren — und sie für seinen eigenen Stack anpassen.

Das Repository ist bewusst modular aufgebaut: Man kann einzelne Regeln oder Skills herausnehmen, ohne das gesamte Setup übernehmen zu müssen. Die CLAUDE.md referenziert die Regeln per @rules/-Syntax, sodass Claude Code sie automatisch lädt.

Feedback und Pull Requests sind willkommen: github.com/alpham8/claude-webdev