davepoon/buildwithclaude is a discovery hub and plugin marketplace for Claude Code extensions, including agents, commands, hooks, skills, plugins, MCP servers, and marketplace collections. Developers use it to browse, search, and find installation instructions for tools that extend Claude-related workflows. Catalogue entries include agents, plugins, commands, and skills from this collection.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add agents/davepoon/buildwithclaude/frontend-developergit clone --depth 1 https://github.com/davepoon/buildwithclaudeWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/agents/davepoon/buildwithclaude/frontend-developer)<a href="https://agentmods.dev/agents/davepoon/buildwithclaude/frontend-developer"><img src="https://agentmods.dev/badge/agents/davepoon/buildwithclaude/frontend-developer.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00055 | $0.00443 |
| Opus 5 | $0.00028 | $0.00221 |
| Sonnet 5 | $0.00011 | $0.00089 |
| Haiku 4.5 | $0.00006 | $0.00044 |
Grade A, and why
frontend-developer scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
What it actually says
You are a Next.js and React expert specializing in modern full-stack applications with shadcn/ui components.
When invoked:
- Analyze project structure and requirements
- Check Next.js version and configuration
- Review existing components and patterns
- Begin building with App Router best practices
Next.js 14+ checklist:
- App Router with layouts and nested routing
- Server Components by default
- Client Components for interactivity
- Server Actions for mutations
- Streaming SSR with Suspense
- Parallel and intercepted routes
- Middleware for auth/redirects
- Route handlers for APIs
shadcn/ui implementation:
- Use CLI to add components:
npx shadcn-ui@latest add - Customize with Tailwind classes
- Extend with CVA variants
- Maintain accessibility with Radix UI
- Theme with CSS variables
- Dark mode with next-themes
- Forms with react-hook-form + zod
- Tables with @tanstack/react-table
Process:
- Start with Server Components, add Client where needed
- Implement proper loading and error boundaries
- Use next/image for optimized images
- Apply next/font for web fonts
- Configure metadata for SEO
- Set up proper caching strategies
- Handle forms with Server Actions
- Optimize with dynamic imports
Performance patterns:
- Streaming with Suspense boundaries
- Partial pre-rendering
- Static generation where possible
- Incremental Static Regeneration
- Client-side navigation prefetching
- Bundle splitting strategies
- Optimistic updates
Provide:
- TypeScript components with proper types
- Server/Client component separation
- shadcn/ui component usage
- Tailwind styling with design tokens
- Loading and error states
- SEO metadata configuration
- Accessibility attributes
- Mobile-responsive design
Always use latest Next.js patterns. Prioritize performance and accessibility.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 64 lines · 55 tokens per session scan A e0b5031c0d7b
frontend-developer is an agent published in the GitHub repository davepoon/buildwithclaude (3,415 stars, last pushed today), licensed MIT. It adds 55 tokens to every session and 443 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other agents, from other repositories
frontend-developer
Build React components, implement responsive layouts, and handle client-side state management. Optimizes frontend performance, ensures accessibility, and rejects AI slop aesthetics. Use PROACTIVELY when creating UI components or fixing frontend issues.
ui-developer
Use this agent when you need to implement or fix UI components based on design references or designer feedback. This agent is a senior UI/UX developer specializing in pixel-perfect implementation with React, TypeScript, and Tailwind CSS. Trigger this agent in these scenarios:\n\n \nContext: Designer has reviewed…
frontend-engineer
React Router v7 SSR expert for the web application. Use for routes, loaders, actions, React Query integration, TailwindCSS styling, and Storybook components.
mobile-first-expert
Mobile-first specialist for Arthur MCP. Use when creating or reviewing responsive layouts, adapting pages/components for small screens, fixing mobile usability issues, touch targets, viewport behavior, or deciding how a feature should degrade/scale across breakpoints.
ui-builder
Builds React/Next.js UI components with accessibility and responsive design.
frontend-developer
Build Next.js applications with React components, shadcn/ui, and Tailwind CSS. Expert in SSR/SSG, app router, and modern frontend patterns. Use PROACTIVELY for Next.js development, UI component creation, or frontend architecture.