Provide best-practice patterns for React component design, state management, and accessibility.
npx skills add https://github.com/BarisSozen/claude --skill pitfalls-react
Please help me install this Agent Skill. Skill: pitfalls-react Source: https://github.com/BarisSozen/claude/tree/main/.claude/skills/pitfalls-react Command: npx skills add https://github.com/BarisSozen/claude --skill pitfalls-react
React development often suffers from subtle pitfalls in component patterns, form handling, and accessibility. This Skill provides a concise, battle-tested set of patterns to build robust, accessible React components.
Integrate the Pitfalls React patterns into your project by reviewing the examples and applying the suggested patterns to existing components.
High-intent search queries and answers about installing and using this skill.
Common React pitfalls include poor component state management and ineffective data flow. This Skill provides battle-tested patterns for component design, effects, and composability to build robust UI elements.
Build accessible React forms using provided patterns for accessible controls and clear error messaging. It covers validation, ARIA labeling, and component structure to ensure form-rich components are usable.
The best way to ensure keyboard navigability is applying accessibility best practices like ARIA labeling and responsive layout patterns. This Skill guides implementing these standards across interactive UI elements.
Implement error boundaries using the provided best-practice patterns for React component resilience. It guides structuring components to handle failures gracefully and avoid common pitfalls in data loading.
No dependencies are required. This Skill provides concise, battle-tested patterns directly applicable to existing React components without needing external libraries or setup.
Apply these React accessibility patterns when building form-rich components, dashboards, or interactive UI elements. Review the examples and integrate the suggested patterns to fix subtle pitfalls in your current components.
OpenAEC-FoundationValidate React code against hooks, TypeScript, and quality checklists.
pelchersProvide ready-to-use Radix primitives for accessible, composable React UI components with keyboard support and ARIA semantics.
mgiffordEnsure form controls have programmatic labels and accessible error messages.
HorusGoulDocument React Aria Components with accessible UI code examples.
