react-rules
CommunityApply structured React development practices for consistency and efficiency.
Authorg-bastianelli
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Ensures React components and hooks are developed consistently, reducing code duplication and improving maintainability.
Core Features & Use Cases
- One Component Per File: Encourages single responsibility by requiring one React component definition per file.
- Folder Structure: Mirrors the JSX tree, aiding in organizing and navigating component hierarchies.
- Props: Utilizes IDs-only props and primitives, fostering cleaner and more predictable component behavior.
- Data Handling: Emphasizes local data fetching and caching, optimizing performance.
- Styling and Layout: Establishes a clear hierarchy and separation of concerns for styling.
- State Management: Outlines best practices for server state, URL state, and global session management.
- Accessibility: Promotes accessibility standards through proper labeling and components usage.
- Testing: Suggests an efficient approach to testing with consideration for the project's specific needs.
Quick Start
Use the 'react-rules' skill within a React component file to enforce discipline in your React component structure and coding style.
Dependency Matrix
Required Modules
None requiredComponents
scriptsreferencesassets
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: react-rules Download link: https://github.com/g-bastianelli/nuthouse/archive/main.zip#react-rules Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 620,000+ vetted skills library on demand.