A frontend developer agent builds and maintains user-facing UI: components, pages, state management, and the integration layer that connects the UI to backend APIs. It reads design specs or tickets and produces working code that matches your component library and accessibility baseline.
Role-specific prompts matter here because frontend codebases are highly opinionated. Whether your team uses React Server Components or a client-side SPA, Tailwind or CSS modules, Zustand or Redux, a generic agent will ignore those choices. A tuned frontend agent writes code that fits your stack on the first attempt.
What this agent owns
- Implement UI components and pages from design specs or ticket descriptions
- Wire components to API endpoints and manage loading, error, and empty states
- Write component tests using the project's chosen testing library
- Keep bundle size and render performance within project-defined thresholds
- Follow the project's component naming, file structure, and styling conventions
Recommended model: Claude Sonnet
Component implementation and state wiring are structured tasks where Sonnet's speed and cost efficiency outperform the marginal gains from Opus.
Example tasks
- Build a data table component with sorting, filtering, and pagination
- Implement an onboarding multi-step form with validation
- Add skeleton loading states to an existing list view
- Refactor class components to functional components with hooks
# create an agent from this template, then start it
$ fleet agent create --name frontend-developer--vendor claude-code --template <template-name>
$ fleet agent start frontend-developer
Find the exact template name with fleet template list.