frontend-patterns
๐ฏSkillfrom affaan-m/everything-claude-code
|Provides reusable React component patterns like composition, compound components, and render props to enhance code modularity and flexibility.
Overview
Frontend Patterns is a skill that provides reusable React component patterns including composition, compound components, render props, and custom hooks. It covers modern frontend patterns for React, Next.js, state management, and performance optimization.
Key Features
- Component composition patterns with Card, Header, and Body examples
- Compound component patterns using React Context for coordinated state
- Render props pattern with generic DataLoader for flexible data fetching
- Custom hook patterns for state management and reusable logic
- Covers React, Next.js, and performance optimization best practices
Who is this for?
This skill is for React developers who want their AI assistant to generate well-structured, pattern-driven component code. It is especially helpful for mid-to-senior developers building scalable frontends who want consistent application of proven React patterns.
Same repository
affaan-m/everything-claude-code(269 items)
Installation
npx vibeindex add affaan-m/everything-claude-code --skill frontend-patternsnpx skills add affaan-m/everything-claude-code --skill frontend-patterns~/.claude/skills/frontend-patterns/SKILL.mdSKILL.md
More from this repository10
Battle-tested Claude Code configurations from an Anthropic hackathon winner
Validates and secures code by providing comprehensive security checks for authentication, input handling, secrets management, and sensitive feature implementation.
Provides reusable design patterns and idiomatic Go solutions for efficient, scalable, and maintainable software architecture.
Validates and enforces consistent code quality, style guidelines, and best practices across programming languages and project structures.
Implements robust backend design patterns like repository, factory, singleton, and dependency injection for scalable and maintainable server-side architectures.
Streamlines Go testing with comprehensive unit, integration, and benchmark strategies, mocking frameworks, and test coverage analysis.
Spring Boot development patterns skill covering REST API design, layered service architecture, data access, caching, async processing, and logging for production-grade Java services
Dynamically updates and refines AI model knowledge through iterative feedback, adaptive learning techniques, and intelligent knowledge integration.
Provides reusable SQL query patterns, database design strategies, and performance optimization techniques for PostgreSQL development
Python development patterns skill covering Pythonic idioms, PEP 8 standards, type hints, and best practices for building robust and maintainable applications