frontend-dev
Automate closed-loop frontend development in React, Vue, or Svelte: input tasks, get code implementation, dev server launch, Playwright-driven visual/functional testing for auth/accessibility/SEO/UX/security/performance, and iterative AI fixes until validated and production-ready.
npx claudepluginhub hemangjoshi37a/claude-code-frontend-devComponent Overview
Component Details
Agents (9)
Specialized agent for comprehensive authentication and login flow testing based on login constitutions.
Master orchestrator that coordinates all frontend development agents with closed-loop visual feedback, parallel execution, iterative improvement, and project-specific constitutions
Self-healing agent that updates and corrects constitution files when errors are encountered during testing. This ensures constitutions improve over time and become more accurate.
Manages development server lifecycle for frontend testing
Expert-level visual testing agent with accessibility, performance, responsive, and advanced frontend validation using testing constitutions
Expert validation agent with deep frontend knowledge, accessibility auditing, performance analysis, and production-readiness assessment
Manages the `.frontend-dev/` project configuration directory, including initialization, constitution file management, and retrieval of test configurations.
Expert SEO specialist with deep knowledge of technical SEO, on-page optimization, Core Web Vitals, structured data, and search engine best practices
Expert UI/UX design specialist with knowledge of latest design trends, visual design principles, user psychology, modern styling techniques, and web design best practices
README
Similar Plugins
frontend-developer
Frontend component development with accessibility and responsive design
web
Web development tools including frontend design workflows
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
amplify
A curated collection of AI coding agent skills for browser automation, frontend design, performance auditing, task tracking, and structured problem-solving workflows.
ui-ux-engineer
Use this agent when building user interfaces, implementing React/Vue/Angular components, handling state management, or optimizing frontend performance. This agent excels at creating responsive, accessible, and performant web applications. Examples:\n\n<example>\nContext: Building a new user interface\nuser: "Create a dashboard for displaying user analytics"\nassistant: "I'll build an analytics dashboard with interactive charts. Let me use the frontend-developer agent to create a responsive, data-rich interface."\n<commentary>\nComplex UI components require frontend expertise for proper implementation and performance.\n</commentary>\n</example>\n\n<example>\nContext: Fixing UI/UX issues\nuser: "The mobile navigation is broken on small screens"\nassistant: "I'll fix the responsive navigation issues. Let me use the frontend-developer agent to ensure it works perfectly across all device sizes."\n<commentary>\nResponsive design issues require deep understanding of CSS and mobile-first development.\n</commentary>\n</example>\n\n<example>\nContext: Optimizing frontend performance\nuser: "Our app feels sluggish when loading large datasets"\nassistant: "Performance optimization is crucial for user experience. I'll use the frontend-developer agent to implement virtualization and optimize rendering."\n<commentary>\nFrontend performance requires expertise in React rendering, memoization, and data handling.\n</commentary>\n</example>
Uses power tools
Uses Bash, Write, or Edit tools
Help us improve
Share bugs, ideas, or general feedback.