Description
react-patterns is an agent skill that sets out principles for building production-ready React applications. Its first section covers component design, distinguishing server components, which handle data fetching and static content without state, from client components, which handle interactivity with state and effects. It also distinguishes presentational components, which only display what they are given through props, from container components, which hold logic and heavier state. The skill then gives design rules for composition, hooks, performance and TypeScript practice. Use it when you are designing React components, deciding where state should live, or reviewing how a component tree is split between server and client. It is part of the sickn33/agentic-awesome-skills repository on GitHub, which has about 47,600 stars. The listing shows it as free, and it has about 1,200 installs. Its security audits show passes from Gen Agent Trust Hub, Socket and Snyk. Install it with npx skills add https://github.com/sickn33/agentic-awesome-skills --skill react-patterns.…
Highlights
- Server versus client components
- Presentational and container components
- Hooks and composition
- Performance and TypeScript rules
- Principles for production apps
Ratings & Reviews
No ratings yet
Be the first to rate react-patterns.
People also visit
react-patterns FAQ
What is the difference between server and client components?
Server components handle data fetching and static content without state. Client components handle interactivity with state and effects.
What is a container component?
One that holds logic and heavier state, as opposed to a presentational component that only displays props.
What else does it cover?
Composition, hooks, performance and TypeScript practice.
How do I install it?
Run npx skills add https://github.com/sickn33/agentic-awesome-skills --skill react-patterns.
Is it checked for security?
Its security audits show passes from Gen Agent Trust Hub, Socket and Snyk.
What are the best react-patterns alternatives?
Popular alternatives to react-patterns include react-patterns, frontend-dev-guidelines and react-performance. See all react-patterns alternatives