Ferramentas

Habilidade de Agente de Código Aberto para Padrões de TypeScript, React e Next.js

✍️ OpenClawRadar📅 Publicado: April 16, 2026🔗 Source
Habilidade de Agente de Código Aberto para Padrões de TypeScript, React e Next.js
Ad

Um desenvolvedor publicou uma Habilidade de Agente de código aberto — uma referência estruturada em markdown — com o objetivo de melhorar a forma como assistentes de IA geram e revisam código para projetos TypeScript, React e Next.js.

O Que É

A habilidade é uma referência de 4.000 linhas contida em 17 arquivos. Não é um tutorial nem um pacote npm, mas um documento para ser consumido por agentes de IA. Foi criada para abordar problemas recorrentes que o autor encontrou em código de frontend gerado por IA, incluindo:

  • Usar asserções de tipo as User em respostas de API em vez de validação em tempo de execução.
  • Colocar diretivas "use client" em páginas inteiras incorretamente.
  • Escrever hooks useEffect com dependências de objeto instáveis.
  • Falhar em distinguir entre bugs reais e meras preferências de estilo durante a revisão de código.
Ad

Principais Recursos e Estrutura

A referência é estruturada com rótulos específicos para orientar as decisões do agente:

  • [REGRAS RÍGIDAS]: Padrões que devem ser seguidos.
  • [PADRÃO]: Abordagens padrão recomendadas.
  • [SITUACIONAL]: Padrões a serem aplicados apenas em contextos específicos.

Inclui fluxogramas de decisão para ajudar os agentes a escolherem o padrão correto, três manuais de depuração para erros de tipo, problemas de hidratação e problemas com useEffect, e heurísticas de revisão de código que separam riscos reais de preferências estilísticas.

Instalação e Compatibilidade

Para instalar, execute:

git clone https://github.com/leejpsd/typescript-react-patterns ~/.claude/skills/typescript-react-patterns

O autor afirma que funciona com Claude Code, Cursor, Codex e Gemini CLI. Feedback sobre padrões ausentes ou orientações incorretas é solicitado.

📖 Leia a fonte completa: r/ClaudeAI

Ad

👀 See Also

Habilidades do Claude para Emular um Ambiente de Estúdio de Design
Tools

Habilidades do Claude para Emular um Ambiente de Estúdio de Design

Um designer compartilha duas habilidades do Claude: uma simula um estúdio com colegas e métodos de design, a outra adiciona 'brincadeira rigorosa' para criatividade.

OpenClawRadar
Precisa de Servidor MCP que Fornece Descoberta Semântica de Ferramentas para Agentes de IA
Tools

Precisa de Servidor MCP que Fornece Descoberta Semântica de Ferramentas para Agentes de IA

Um servidor MCP chamado Need permite busca semântica em mais de 10.000 ferramentas de brew, npm, pip e cargo. Quando um agente solicita uma tarefa como 'comprima esses PNGs', ele encontra o pngquant, instala, executa e relata o sucesso.

OpenClawRadar
Agentes Subordinados Paralelos no Claude Code: Quando Eles Economizam vs. Queimam Tokens
Tools

Agentes Subordinados Paralelos no Claude Code: Quando Eles Economizam vs. Queimam Tokens

Anthropic relata que sistemas multiagente usam cerca de 15× mais tokens que um chat único, mas o cache de prompt oferece 90% de desconto nos tokens. Se subagentes economizam ou queimam dinheiro depende das taxas de acerto do cache.

OpenClawRadar
Usuário do Reddit mede a sobrecarga de tokens do MCP: 67 mil tokens consumidos antes de qualquer pergunta
Tools

Usuário do Reddit mede a sobrecarga de tokens do MCP: 67 mil tokens consumidos antes de qualquer pergunta

Um desenvolvedor mediu a sobrecarga de tokens do seu servidor MCP em 67.000 tokens consumidos antes de digitar uma única pergunta, com o Playwright MCP usando 13.600 tokens e o GitHub MCP usando 18.000 tokens em modo ocioso. Eles substituíram o MCP por habilidades e ferramentas CLI para reduzir os custos de contexto.

OpenClawRadar