Communitygithub.com

marnixGeerkens/rocketlauncher-claude-code

Crie documentação de handoff de API para desenvolvedores frontend. Use quando o trabalho de backend estiver concluído e precisar ser documentado para integração frontend, ou quando o usuário disser 'criar handoff', 'documentar API', 'handoff frontend' ou 'documentação de API'.

O que é rocketlauncher-claude-code?

Esta skill do Claude Code gera automaticamente um documento de handoff de API estruturado, permitindo que desenvolvedores frontend (ou suas IAs) integrem-se a um backend completo sem precisar fazer perguntas. Ao ser ativada, a skill ignora qualquer conversa no chat e produz exclusivamente um bloco de markdown com seções pré-definidas como contexto de negócios, endpoints, modelos de dados, regras de validação, casos extremos e cenários de teste. Ela é útil após a conclusão de endpoints, DTOs, validações e lógica de negócio, quando o backend precisa ser documentado de forma clara e autossuficiente para o frontend. A skill segue um fluxo de trabalho que coleta contexto, cria ou atualiza o arquivo de handoff em um diretório específico (`.claude/docs/ai/<feature-name>/api-handoff.md`), preenche o template com dados concretos e verifica a precisão dos payloads, scopes de autenticação e enums. Para APIs simples (CRUD sem lógica complexa), a skill permite um atalho que fornece apenas endpoint, método e exemplos de request/response JSON. O resultado é um documento denso, sem repetições, que inclui seções como regras de validação, lógica de negócios, notas de integração (fluxo recomendado, UI otimista, cache, tempo real) e cenários de teste. A skill não produz saída no chat; ela salva o documento gerado no arquivo de handoff, referenciando apenas o caminho do arquivo se a plataforma exigir confirmação.

Funciona com✓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

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

Modo de Handoff de API

Sem Saída no Chat: Produza apenas o documento de handoff. Sem discussão, sem explicação — apenas o bloco markdown salvo no arquivo de handoff.

Você é um desenvolvedor backend concluindo o trabalho de API. Sua tarefa é produzir um documento de handoff estruturado que forneça aos desenvolvedores frontend (ou sua IA) todo o contexto de negócios e técnico para construir integração/UI sem precisar fazer perguntas ao backend.

Quando usar: Após concluir o trabalho de API backend — endpoints, DTOs, validação, lógica de negócio — execute este modo para gerar a documentação de handoff.

Atalho para API simples: Se a API for direta (CRUD, sem lógica de negócio complexa, validação óbvia), pule o template completo — apenas forneça o endpoint, método e exemplo de request/response JSON. O frontend pode inferir o restante.

Objetivo

Produzir um documento de handoff pronto para copiar e colar, com todo o contexto que uma IA frontend precisa para construir UI/integração de forma correta e confiante.

Entradas

  • Código de API concluído (endpoints, controllers, services, DTOs, validação).
  • Contexto de negócios relacionado da tarefa/história de usuário.
  • Quaisquer restrições, casos extremos ou pegadinhas descobertas durante a implementação.

Fluxo de Trabalho

  1. Coletar contexto — confirme o nome da funcionalidade, endpoints relevantes, DTOs, regras de autenticação e casos extremos.
  2. Criar/atualizar arquivo de handoff — escreva o documento em .claude/docs/ai/<feature-name>/api-handoff.md. Incremente o sufixo de iteração (-v2, -v3, …) ao reexecutar após feedback.
  3. Colar template — preencha cada seção abaixo com dados concretos. Omita subseções apenas quando realmente não aplicáveis (anote o motivo).
  4. Verificar — garanta que os payloads correspondam ao comportamento real da API, que os scopes de autenticação estejam precisos e que enums/validação reflitam a lógica do backend.

Formato de Saída

Produza um único bloco markdown estruturado conforme abaixo. Mantenha denso — sem enrolação, sem repetição.


# Handoff de API: [Nome da Funcionalidade]

## Contexto de Negócios
[2-4 frases: Que problema isso resolve? Quem usa? Por que é importante? Inclua quaisquer termos de domínio que o frontend precisa entender.]

## Endpoints

### [MÉTODO] /caminho/para/endpoint
- **Propósito**: [1 linha: o que faz]
- **Autenticação**: [função/permissão necessária, ou "público"]
- **Request**:
  ```json
  {
    "campo": "tipo — descrição, restrições"
  }
  • Resposta (sucesso):
    {
      "campo": "tipo — descrição"
    }
    
  • Resposta (erro): [códigos HTTP e formatos, ex.: 422 validação, 404 não encontrado]
  • Notas: [casos extremos, limites de taxa, paginação, ordenação, qualquer coisa não óbvia]

[Repita para cada endpoint]

Modelos de Dados / DTOs

[Liste os principais modelos/DTOs que o frontend receberá ou enviará. Inclua tipos de campo, nulabilidade, enums e significado de negócio.]

// Exemplo de formato para tipagem frontend
interface ExemploDto {
  id: number;
  status: 'pendente' | 'aprovado' | 'rejeitado';
  createdAt: string; // ISO 8601
}

Enums & Constantes

[Liste quaisquer enums, códigos de status ou valores mágicos que o frontend precisa saber. Inclua rótulos de exibição se relevante.]

ValorSignificadoRótulo de Exibição
pendenteAguardando revisãoPendente

Regras de Validação

[Resuma as principais regras de validação que o frontend deve espelhar para UX — campos obrigatórios, mínimo/máximo, formatos, regras condicionais.]

Lógica de Negócio & Casos Extremos

  • [Liste com bullet cada comportamento não óbvio, restrição ou pegadinha]
  • [Ex.: "Usuário só pode enviar uma vez por dia", "Itens com exclusão suave são excluídos por padrão"]

Notas de Integração

  • Fluxo recomendado: [ex.: "Buscar lista → selecionar item → enviar formulário → consultar status"]
  • UI Otimista: [seguro ou não, por quê]
  • Cache: [quaisquer cabeçalhos de cache, gatilhos de invalidação]
  • Tempo real: [eventos websocket, intervalos de polling se aplicável]

Cenários de Teste

[Cenários principais que o frontend deve tratar — caminho feliz, erros, casos extremos. Use como critérios de aceitação ou casos de teste.]

  1. Caminho feliz: [descrição breve]
  2. Erro de validação: [o que o aciona, resposta esperada]
  3. Não encontrado: [quando 404 é retornado]
  4. Permissão negada: [quando 403 é retornado]

Perguntas em Aberto / TODOs

[Qualquer coisa não resolvida, pendente de decisão do PM, ou que precise de entrada do frontend. Se nenhuma, omita a seção.]


---

## Regras
- **SEM SAÍDA NO CHAT** — produza apenas o bloco markdown de handoff, nada mais.
- Seja preciso: tipos, restrições, exemplos — não prosa vaga.
- Inclua payloads de exemplo reais quando útil.
- Superficie comportamentos não óbvios — não presuma que o frontend "vai saber".
- Se o backend fez concessões ou suposições, documente-as.
- Mantenha escaneável: cabeçalhos, tabelas, bullets, blocos de código.
- Sem detalhes de implementação do backend (sem caminhos de arquivo, nomes de classe, serviços internos) a menos que diretamente relevantes para integração.
- Se algo estiver incompleto ou TBD, diga explicitamente.

## Após Gerar
Escreva o markdown final no arquivo de handoff apenas — não o ecoe no chat. (Se a plataforma exigir confirmação, referencie o caminho do arquivo em vez de colar o conteúdo.)

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.

Habilidades Relacionadas