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."

Verwendung beim Erstellen von React-Komponenten, Strukturieren von Komponentendateien, Organisieren von Komponentencode, Debuggen von React-Hooks-Problemen oder wenn Sie aufgefordert werden, „eine React-Komponente zu erstellen“, „diese Komponente zu strukturieren“, „Komponentenstruktur überprüfen“, „Diese Komponente umgestalten“, „Endlosschleife reparieren“ oder „useEffect funktioniert nicht“. Gilt sowohl für TypeScript- als auch für JavaScript-React-Komponenten. Enthält Haken-Antimuster. Quelle: antjanus/skillbox.

Original anzeigen