ideal-react-component

SKILL.md

A battle-tested pattern for organizing React component files that emphasizes readability, maintainability, and logical flow. This structure helps teams maintain consistency and makes components easier to understand at a glance.

Core principle: Declare everything in a predictable order—imports to styles to types to logic to render—so developers know where to find things.

Why: "When you deal with more than a handful of imports, it's really easy to get lost in what the file is using."

Úselo al crear componentes de React, estructurar archivos de componentes, organizar el código de componentes, depurar problemas de ganchos de React, o cuando se le solicita "crear un componente de React", "estructurar este componente", "revisar la estructura del componente", "refactorizar este componente", "arreglar el bucle infinito" o "useEffect no funciona". Se aplica a los componentes TypeScript y JavaScript React. Incluye ganchos antipatrones. Fuente: antjanus/skillbox.

Ver original