Frontend Development
The essential frontend stack. React patterns, Next.js conventions, and intentional design — all three skills activate simultaneously so every component is architecturally sound, performant, and visually distinctive. No MCP servers needed.
Skills
React Best Practices
Modern React patterns, hooks, composition strategies, and performance optimization.
npx skills add vercel-labs/agent-skills/react-best-practicesFrontend Design
Bold, intentional UI design — solves the 'AI slop' problem with unique palettes and layouts.
npx skills add anthropics/skills/frontend-designNext.js Best Practices
App Router conventions, Server vs Client Components, data fetching, and Suspense streaming.
npx skills add vercel-labs/next-skills/next-best-practicesSetup
Run these commands in your project directory. Each skill adds a SKILL.md file that your AI agent reads automatically.
npx skills add vercel-labs/agent-skills/react-best-practices
npx skills add anthropics/skills/frontend-design
npx skills add vercel-labs/next-skills/next-best-practicesAsk your AI agent to build a component or page. All three skills activate simultaneously — React patterns shape the structure, Next.js conventions guide the architecture, and frontend design drives the visual decisions.
Use Cases
- React component libraries
- Marketing and landing pages
- Next.js web applications
- Design system implementation