Communitygithub.com

marnixGeerkens/rocketlauncher-claude-code

Erstelle API-Übergabedokumentation für Frontend-Entwickler. Verwende dies, wenn die Backend-Arbeit abgeschlossen ist und für die Frontend-Integration dokumentiert werden muss, oder wenn der Benutzer 'Übergabe erstellen', 'API dokumentieren', 'Frontend-Übergabe' oder 'API-Dokumentation' sagt.

Was ist rocketlauncher-claude-code?

Diese Fähigkeit (Skill) ermöglicht es einem KI-Agenten, automatisch eine strukturierte, umfassende API-Übergabedokumentation zu erstellen, sobald die Backend-Entwicklung abgeschlossen ist. Das Ziel ist es, Frontend-Entwicklern (oder deren KI-Assistenten) alle notwendigen geschäftlichen und technischen Kontextinformationen zu liefern, damit sie Integrationen und Benutzeroberflächen ohne Rückfragen an das Backend umsetzen können. Der Skill unterstützt jede Codebasis und jedes API-Design, erfordert jedoch die Ausführung in einem KI-gesteuerten Entwicklungstool (z. B. Claude Code). Die Arbeitsweise besteht darin, den vollständigen API-Code sowie die zugehörigen Geschäftskontexte und Randfälle zu analysieren, eine detaillierte Vorlage mit Abschnitten wie Endpunkte, Datenmodelle, Validierungsregeln, Geschäftslogik und Testszenarien auszufüllen und das Ergebnis als Markdown-Datei abzulegen. Der Skill zeichnet sich durch strikte Regeln aus: Es erfolgt keine Chat-Ausgabe des Dokuments – nur die reine Dateierstellung –, und die Dokumentation ist präzise, vollständig und auf das Nötigste reduziert. Bei einfachen APIs (CRUD, keine komplexe Geschäftslogik) wird eine Kurzform verwendet. Die Iterationen werden durch Versionssuffixe (z. B. -v2) nachverfolgt, sodass Feedback einfach eingearbeitet werden kann.

Funktioniert mit✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/marnixGeerkens/rocketlauncher-claude-code/tree/HEAD/components/skills/enterprise-communication/backend-to-frontend-handoff-docs

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

API-Übergabemodus

Keine Chat-Ausgabe: Erstelle nur das Übergabedokument. Keine Diskussion, keine Erklärung – nur der Markdown-Block, der in die Übergabedatei gespeichert wird.

Du bist ein Backend-Entwickler, der API-Arbeit abschließt. Deine Aufgabe ist es, ein strukturiertes Übergabedokument zu erstellen, das Frontend-Entwicklern (oder deren KI) den vollständigen geschäftlichen und technischen Kontext liefert, um Integrationen / Benutzeroberflächen zu erstellen, ohne Rückfragen an das Backend stellen zu müssen.

Wann verwenden: Nach Abschluss der Backend-API-Arbeit – Endpunkte, DTOs, Validierung, Geschäftslogik – führe diesen Modus aus, um die Übergabedokumentation zu generieren.

Einfache API-Abkürzung: Wenn die API einfach ist (CRUD, keine komplexe Geschäftslogik, offensichtliche Validierung), überspringe die vollständige Vorlage – gib einfach den Endpunkt, die Methode und ein Beispiel-Request/Response-JSON an. Das Frontend kann den Rest ableiten.

Ziel

Erstelle ein kopierfertiges Übergabedokument mit dem gesamten Kontext, den eine Frontend-KI benötigt, um UI/Integration korrekt und sicher zu erstellen.

Eingaben

  • Fertiger API-Code (Endpunkte, Controller, Services, DTOs, Validierung).
  • Zugehöriger Geschäftskontext aus der Aufgabe/User-Story.
  • Alle Einschränkungen, Randfälle oder „Gotchas“, die bei der Implementierung entdeckt wurden.

Arbeitsablauf

  1. Kontext sammeln – bestätige Feature-Name, relevante Endpunkte, DTOs, Auth-Regeln und Randfälle.
  2. Übergabedatei erstellen/aktualisieren – schreibe das Dokument nach .claude/docs/ai/<feature-name>/api-handoff.md. Erhöhe das Iterationssuffix (-v2, -v3, …), wenn es nach Feedback erneut ausgeführt wird.
  3. Vorlage einfügen – fülle jeden Abschnitt unten mit konkreten Daten aus. Lasse Unterabschnitte nur dann weg, wenn sie wirklich nicht zutreffen (begründe warum).
  4. Überprüfen – stelle sicher, dass Payloads mit dem tatsächlichen API-Verhalten übereinstimmen, Auth-Bereiche korrekt sind und Enums/Validierung die Backend-Logik widerspiegeln.

Ausgabeformat

Erstelle einen einzelnen Markdown-Block, der wie folgt aufgebaut ist. Halte ihn dicht – kein Füllmaterial, keine Wiederholungen.


# API-Übergabe: [Feature-Name]

## Geschäftskontext
[2-4 Sätze: Welches Problem wird gelöst? Wer verwendet es? Warum ist es wichtig? Füge alle Domain-Begriffe hinzu, die das Frontend verstehen muss.]

## Endpunkte

### [METHODE] /pfad/zum/endpunkt
- **Zweck**: [1 Zeile: was es tut]
- **Auth**: [erforderliche Rolle/Berechtigung, oder „öffentlich“]
- **Request**:
  ```json
  {
    "feld": "typ — beschreibung, einschränkungen"
  }
  • Response (erfolgreich):
    {
      "feld": "typ — beschreibung"
    }
    
  • Response (Fehler): [HTTP-Codes und Formate, z. B. 422 Validierung, 404 nicht gefunden]
  • Anmerkungen: [Randfälle, Ratenbegrenzungen, Paginierung, Sortierung, alles nicht Offensichtliche]

[Wiederhole für jeden Endpunkt]

Datenmodelle / DTOs

[Liste die wichtigsten Modelle/DTOs auf, die das Frontend empfängt oder sendet. Füge Feldtypen, Nullability, Enums und geschäftliche Bedeutung hinzu.]

// Beispielstruktur für Frontend-Typisierung
interface ExampleDto {
  id: number;
  status: 'pending' | 'approved' | 'rejected';
  createdAt: string; // ISO 8601
}

Enums & Konstanten

[Liste alle Enums, Statuscodes oder magischen Werte auf, die das Frontend kennen muss. Füge ggf. Anzeigebezeichnungen hinzu.]

WertBedeutungAnzeigebezeichnung
pendingWartet auf PrüfungAusstehend

Validierungsregeln

[Fasse die wichtigsten Validierungsregeln zusammen, die das Frontend für die UX spiegeln sollte – Pflichtfelder, Min/Max, Formate, bedingte Regeln.]

Geschäftslogik & Randfälle

  • [Liste jedes nicht offensichtliche Verhalten, jede Einschränkung oder jedes „Gotcha“ auf]
  • [z. B.: „Benutzer kann nur einmal pro Tag einreichen“, „Soft-gelöschte Elemente sind standardmäßig ausgeschlossen“]

Integrationshinweise

  • Empfohlener Ablauf: [z. B.: „Liste abrufen → Element auswählen → Formular absenden → Status abfragen“]
  • Optimistische UI: [sicher oder nicht, warum]
  • Caching: [alle Cache-Header, Invalidierungsauslöser]
  • Echtzeit: [Websocket-Ereignisse, Abfrageintervalle, falls zutreffend]

Testszenarien

[Wichtige Szenarien, die das Frontend behandeln sollte – Happy Path, Fehler, Randfälle. Verwende sie als Abnahmekriterien oder Testfälle.]

  1. Happy Path: [kurze Beschreibung]
  2. Validierungsfehler: [was löst ihn aus, erwartete Antwort]
  3. Nicht gefunden: [wann 404 zurückgegeben wird]
  4. Zugriff verweigert: [wann 403 zurückgegeben wird]

Offene Fragen / TODOs

[Alles Ungeklärte, ausstehende PM-Entscheidung oder Frontend-Input erforderlich. Wenn keine, Abschnitt weglassen.]


---

## Regeln
- **KEINE CHAT-AUSGABE** – erzeuge nur den Übergabe-Markdown-Block, nichts anderes.
- Sei präzise: Typen, Einschränkungen, Beispiele – keine vagen Textblöcke.
- Füge dort echte Beispiel-Payloads ein, wo es hilfreich ist.
- Hebe nicht offensichtliche Verhaltensweisen hervor – gehe nicht davon aus, dass das Frontend „es einfach wissen wird“.
- Wenn das Backend Kompromisse oder Annahmen getroffen hat, dokumentiere sie.
- Halte es überblickbar: Überschriften, Tabellen, Aufzählungen, Code-Blöcke.
- Keine Backend-Implementierungsdetails (keine Dateipfade, Klassennamen, internen Services), es sei denn, sie sind direkt für die Integration relevant.
- Wenn etwas unvollständig oder TBD ist, sage es explizit.

## Nach der Erstellung
Schreibe den endgültigen Markdown nur in die Übergabedatei – gib ihn nicht im Chat aus. (Wenn die Plattform eine Bestätigung erfordert, verweise auf den Dateipfad, anstatt den Inhalt einzufügen.)

Individual skills in this repo

This repo contains 13 individual skills — each has its own dedicated page.

marnixGeerkens/rocketlauncher-claude-code

When the user wants to optimize, improve, or increase conversions on any marketing page — including homepage, landing pages, pricing pages, feature pages, or blog posts. Also use when the user says "CRO," "conversion rate optimization," "this page isn't converting," "improve conversions," or "why isn't this page working." For signup/registration flows, see signup-flow-cro. For post-signup activation, see onboarding-cro. For forms outside of signup, see form-cro. For popups/modals, see popup-cro.

marnixGeerkens/rocketlauncher-claude-code

Balance visual design with ATS compatibility for creative roles. Use when the user is in design, art, writing, marketing creative, or any visual/creative field and needs a resume that looks distinctive but still parses.

marnixGeerkens/rocketlauncher-claude-code

Transform resume bullets into detailed portfolio case studies with context, action, and outcome. Use when the user mentions portfolio, case study, project write-up, or expanding a resume bullet into a longer narrative.

marnixGeerkens/rocketlauncher-claude-code

Expert in building portfolios that actually land jobs and clients - not just showing work, but creating memorable experiences. Covers developer portfolios, designer portfolios, creative portfolios, and portfolios that convert visitors into opportunities. Use when: portfolio, personal website, showcase work, developer portfolio, designer portfolio.

marnixGeerkens/rocketlauncher-claude-code

Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.

marnixGeerkens/rocketlauncher-claude-code

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

marnixGeerkens/rocketlauncher-claude-code

Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organization with features directory, MUI v7 styling, TanStack Router, performance optimization, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.

marnixGeerkens/rocketlauncher-claude-code

Next.js App Router principles. Server Components, data fetching, routing patterns.

marnixGeerkens/rocketlauncher-claude-code

Expert integration of Supabase Auth with Next.js App Router Use when: supabase auth next, authentication next.js, login supabase, auth middleware, protected route.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.

marnixGeerkens/rocketlauncher-claude-code

Document frontend data needs for backend developers. Use when frontend needs to communicate API requirements to backend, or user says 'backend requirements', 'what data do I need', 'API requirements', or is describing data needs for a UI.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive Python library for astronomy and astrophysics. This skill should be used when working with astronomical data including celestial coordinates, physical units, FITS files, cosmological calculations, time systems, tables, world coordinate systems (WCS), and astronomical data analysis. Use when tasks involve coordinate transformations, unit conversions, FITS file manipulation, cosmological distance calculations, time scale conversions, or astronomical data processing.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.

Verwandte Skills