React 19 skill

O que ela faz

A skill, mantida pela equipe do Prowler, traz as regras de React 19 que o Claude segue ao escrever componentes em .tsx. A principal: nada de useMemo e useCallback feitos à mão, porque o React Compiler já otimiza sozinho. Os imports são sempre nomeados, nunca import React.

O componente nasce como Server Component, sem diretiva, e só vira "use client" quando precisa de estado, efeito, clique ou recurso do navegador, como localStorage. O hook use() lê promessas e contexto até dentro de um if, e o useActionState liga o formulário a uma ação no servidor com o estado de salvando.

Também aposenta o forwardRef: no React 19, ref é uma prop comum. As regras vêm com exemplos em TypeScript, várias com o certo e o errado lado a lado. Em projeto Next.js com App Router e Server Actions, a skill manda usar junto a nextjs-16, do mesmo repositório.

Nas palavras de quem fez

Quando usar

• Começar um projeto novo em React 19 ou Next.js
• Atualizar componentes cheios de useMemo, useCallback e forwardRef
• Fazer formulário com botão de salvando sem biblioteca extra
• Decidir o que roda no servidor e o que precisa de "use client"
• Padronizar o jeito de escrever componentes num time

Depois de instalar, é só pedir assim

• Reescreve esse componente no padrão do React 19, tirando useMemo e forwardRef
• Cria o formulário de contato com useActionState e botão que mostra salvando
• Revisa essa página e me diz o que pode ser Server Component

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

• Gen Agent Trust HubPassou
• SocketPassou
• SnykPassou

Perguntas