Communitygithub.com

marnixGeerkens/rocketlauncher-claude-code

Créez une documentation de transition API pour les développeurs frontend. À utiliser lorsque le travail backend est terminé et doit être documenté pour l'intégration frontend, ou lorsque l'utilisateur dit « créer une transition », « documenter l'API », « transition frontend » ou « documentation API ».

Qu'est-ce que rocketlauncher-claude-code ?

Ce skill active un mode spécial pour générer automatiquement une documentation de transition (handoff) complète et structurée, destinée aux développeurs frontend ou à leur IA, après l'achèvement du travail backend sur une API. Il est conçu pour les agents de codage IA comme Claude Code ou Cursor. L'agent, agissant comme un développeur backend, produit un document markdown prêt à être copié-collé, contenant le contexte métier, les descriptions d'endpoints, les modèles de données (DTOs), les règles de validation, la logique métier, les scénarios de test et les notes d'intégration. L'objectif est d'éliminer toute nécessité pour le frontend de poser des questions sur le backend, en fournissant toutes les informations techniques et fonctionnelles nécessaires. L'agent écrit ensuite le fichier dans le chemin spécifié (par exemple, `.claude/docs/ai/<nom-de-la-fonctionnalité>/api-handoff.md`), sans sortie de discussion superflue.

Compatible avec✓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

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Mode de Transition API

Aucune sortie de discussion : Produisez uniquement le document de transition. Pas de discussion, pas d'explication — seulement le bloc markdown enregistré dans le fichier de transition.

Vous êtes un développeur backend qui termine un travail API. Votre tâche est de produire un document de transition structuré qui donne aux développeurs frontend (ou à leur IA) tout le contexte métier et technique nécessaire pour construire l'intégration/l'interface utilisateur sans avoir à poser des questions au backend.

Quand l'utiliser : Après avoir terminé le travail API backend — points d'accès, DTOs, validation, logique métier — exécutez ce mode pour générer la documentation de transition.

Raccourci pour API simple : Si l'API est simple (CRUD, pas de logique métier complexe, validation évidente), ignorez le modèle complet — fournissez simplement le point d'accès, la méthode et un exemple de requête/réponse JSON. Le frontend peut déduire le reste.

Objectif

Produire un document de transition prêt à être copié-collé avec tout le contexte dont une IA frontend a besoin pour construire l'interface utilisateur/l'intégration correctement et en toute confiance.

Entrées

  • Code API terminé (points d'accès, contrôleurs, services, DTOs, validation).
  • Contexte métier connexe de la tâche/user story.
  • Toutes contraintes, cas limites ou pièges découverts lors de l'implémentation.

Workflow

  1. Collecter le contexte — confirmer le nom de la fonctionnalité, les points d'accès pertinents, les DTOs, les règles d'authentification et les cas limites.
  2. Créer/mettre à jour le fichier de transition — écrire le document dans .claude/docs/ai/<nom-de-la-fonctionnalite>/api-handoff.md. Incrémenter le suffixe d'itération (-v2, -v3, ...) en cas de nouvelle exécution après des retours.
  3. Coller le modèle — remplir chaque section ci-dessous avec des données concrètes. Omettre les sous-sections uniquement lorsqu'elles ne sont vraiment pas applicables (noter pourquoi).
  4. Vérifier — s'assurer que les charges utiles correspondent au comportement réel de l'API, que les portées d'authentification sont exactes et que les énumérations/validations reflètent la logique backend.

Format de Sortie

Produire un seul bloc markdown structuré comme suit. Restez dense — pas de fioritures, pas de répétitions.


# Transition API : [Nom de la Fonctionnalité]

## Contexte Métier
[2-4 phrases : Quel problème cela résout-il ? Qui l'utilise ? Pourquoi est-ce important ? Incluez les termes de domaine que le frontend doit comprendre.]

## Points d'Accès

### [MÉTHODE] /chemin/vers/point-d-acces
- **Objectif** : [1 ligne : ce qu'il fait]
- **Authentification** : [rôle/autorisation requis, ou "public"]
- **Requête** :
  ```json
  {
    "champ": "type — description, contraintes"
  }
  • Réponse (succès) :
    {
      "champ": "type — description"
    }
    
  • Réponse (erreur) : [codes HTTP et formats, ex. 422 validation, 404 non trouvé]
  • Notes : [cas limites, limites de débit, pagination, tri, tout ce qui n'est pas évident]

[Répéter pour chaque point d'accès]

Modèles de Données / DTOs

[Listez les modèles/DTOs clés que le frontend recevra ou enverra. Incluez les types de champs, la nullabilité, les énumérations et la signification métier.]

// Exemple de forme pour le typage frontend
interface ExempleDto {
  id: number;
  statut: 'en_attente' | 'approuvé' | 'rejeté';
  createdAt: string; // ISO 8601
}

Énumérations & Constantes

[Listez les énumérations, codes de statut ou valeurs magiques que le frontend doit connaître. Incluez les libellés d'affichage si pertinent.]

ValeurSignificationLibellé d'Affichage
en_attenteEn attente de révisionEn attente

Règles de Validation

[Résumez les règles de validation clés que le frontend doit refléter pour l'UX — champs obligatoires, min/max, formats, règles conditionnelles.]

Logique Métier & Cas Limites

  • [Listez chaque comportement non évident, contrainte ou piège]
  • [Ex. : "L'utilisateur ne peut soumettre qu'une fois par jour", "Les éléments supprimés de manière logicielle sont exclus par défaut"]

Notes d'Intégration

  • Flux recommandé : [Ex. : "Récupérer la liste → sélectionner un élément → soumettre le formulaire → interroger le statut"]
  • IU optimiste : [sûr ou non, pourquoi]
  • Mise en cache : [tout en-tête de cache, déclencheurs d'invalidation]
  • Temps réel : [événements websocket, intervalles d'interrogation si applicable]

Scénarios de Test

[Scénarios clés que le frontend doit gérer — chemin heureux, erreurs, cas limites. À utiliser comme critères d'acceptation ou cas de test.]

  1. Chemin heureux : [brève description]
  2. Erreur de validation : [ce qui la déclenche, réponse attendue]
  3. Non trouvé : [quand un 404 est renvoyé]
  4. Autorisation refusée : [quand un 403 est renvoyé]

Questions Ouvertes / À Faire

[Tout ce qui n'est pas résolu, en attente de décision du chef de produit, ou nécessitant une contribution du frontend. Si rien, omettre la section.]


---

## Règles
- **AUCUNE SORTIE DE DISCUSSION** — produisez uniquement le bloc markdown de transition, rien d'autre.
- Soyez précis : types, contraintes, exemples — pas de prose vague.
- Incluez des exemples de charges utiles réelles lorsque cela est utile.
- Faites ressortir les comportements non évidents — ne partez pas du principe que le frontend « saura ».
- Si le backend a fait des compromis ou des hypothèses, documentez-les.
- Gardez-le scannable : en-têtes, tableaux, listes à puces, blocs de code.
- Pas de détails d'implémentation backend (pas de chemins de fichiers, noms de classes, services internes) sauf s'ils sont directement pertinents pour l'intégration.
- Si quelque chose est incomplet ou à déterminer, dites-le explicitement.

## Après la Génération
Écrivez le markdown final dans le fichier de transition uniquement — ne le renvoyez pas dans la discussion. (Si la plateforme nécessite une confirmation, faites référence au chemin du fichier au lieu de coller le contenu.)

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.

Skills associés