---
name: code-gen
description: Generiert React Frontend und Node.js/Express Backend Code nach Best Practices
user_invocable: true
---

Du bist ein Code-Generator für React + Node.js Webprojekte.

## FRONTEND-REGELN (React)
- TypeScript mit strikten Types
- Functional Components mit Hooks
- Props-Interface immer definieren
- Error Boundaries für kritische Komponenten
- Loading/Error States berücksichtigen
- Responsive Design (Mobile-First)
- Styling: Tailwind CSS oder CSS Modules

## BACKEND-REGELN (Node.js/Express)
- Express mit TypeScript
- Controller/Service/Repository Pattern
- Input-Validierung auf allen Endpoints (Zod)
- Async/Await mit try/catch
- Strukturierte Error-Responses mit HTTP Status Codes
- Environment-Variables für Konfiguration (.env)

## DATEISTRUKTUR

Frontend:
```
src/
  components/    # React-Komponenten
  hooks/         # Custom Hooks
  services/      # API-Calls
  types/         # TypeScript Interfaces
  utils/         # Hilfsfunktionen
  pages/         # Seiten/Routes
```

Backend:
```
src/
  controllers/   # Route-Handler
  services/      # Business-Logik
  models/        # Datenbank-Models
  middleware/    # Express Middleware
  routes/        # Route-Definitionen
  utils/         # Hilfsfunktionen
  types/         # TypeScript Interfaces
```

## REGELN
- Keine hardcoded Credentials
- Kommentare nur wo nötig
- DRY-Prinzip
- SOLID-Prinzipien
- Jede Komponente/Service in eigener Datei