React Best Practices
vercel-labs/vercel-pluginWhen you write React components in TSX files, you want them to be clean, fast, and easy to maintain. This skill checks your code after you edit several components. It looks at structure, hooks, accessibility, performance, and TypeScript patterns. It gives you helpful warnings and tips to improve your code.
The skill also spots old CSS-in-JS libraries like styled-components or MUI. It suggests switching to shadcn/ui with Tailwind CSS for better performance with Vercel. You get clear messages and can even link to a full upgrade guide.
This tool works for any React project using TSX or JSX in common folders. It helps you follow modern best practices without needing to remember every rule.
Add React Best Practices skill to your workflow
Global
mkdir -p ~/.claude/skills/react-best-practicesProject
mkdir -p .claude/skills/react-best-practicesSource Repository
More Code Review & Quality Claude Code Skills
Improve Codebase Architecturemattpocock/skills
Scan your codebase for architecture improvements with visual reports and pick one to refactor
Web Design Guidelinesvercel-labs/agent-skills
Review your UI code for compliance with web interface guidelines
Caveman Reviewjuliusbrussee/caveman
Ultra-compressed one-line code review comments that cut noise
Zoom Outmattpocock/skills
Get a big picture view of your code with a simple map of modules and callers
Codebase Designmattpocock/skills
Create deep modules with tiny interfaces and lots of hidden logic for testability
Requesting Code Reviewobra/superpowers
Catch code issues early with focused automated reviews before every merge
Request Refactor Planmattpocock/skills
Plan safe code refactors with tiny commits and clear GitHub issues
Receiving Code Reviewobra/superpowers
Think first, then code. Verify feedback before making changes. Stay objective