frontend-developer

v1.0.0

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>

Claude Code

by Michael Galpert1.9kupdated 2 weeks ago

Source

$ git clone https://github.com/composio-community/awesome-claude-plugins

Clone the source, then follow the repository's marketplace instructions for your runtime. The plugin root is frontend-developer/ inside the repository.

Layout

frontend-developer/

└── .claude-plugin/plugin.json

Manifests1

frontend-developer/.claude-plugin/plugin.json

{
  "name": "frontend-developer",
  "description": "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>",
  "version": "1.0.0",
  "author": {
    "name": "Michael Galpert"
  },
  "homepage": "https://github.com/ccplugins/awesome-claude-code-plugins/tree/main/plugins/frontend-developer"
}