jbvc/frontend-developer
Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend architecture. Optimizes performance and ensures accessibility. Use PROACTIVELY when creating UI components or fixing frontend issues.
50
50%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Advisory
Suggest reviewing before use
Quality
Discovery
77%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a solid skill description that clearly communicates both capabilities and trigger conditions. It names specific technologies and actions, and includes an explicit 'Use when' clause. The main weaknesses are moderate trigger term coverage (missing common user terms like CSS, styling, web app, .tsx) and some overlap risk with other frontend-related skills.
Suggestions
Expand trigger terms to include common user variations like 'CSS', 'styling', 'web app', 'TypeScript', '.tsx', '.jsx' to improve discoverability.
Sharpen the 'Use when' clause to reduce conflict risk, e.g., 'Use when working with React/Next.js components, .tsx/.jsx files, or when the user mentions React hooks, JSX, or client-side rendering.'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'Build React components', 'implement responsive layouts', 'handle client-side state management', 'Optimizes performance', 'ensures accessibility'. Also names specific technologies (React 19, Next.js 15). | 3 / 3 |
Completeness | Clearly answers 'what' (build React components, implement layouts, handle state, optimize performance, ensure accessibility) and 'when' ('Use PROACTIVELY when creating UI components or fixing frontend issues'). The explicit 'Use when' clause is present. | 3 / 3 |
Trigger Term Quality | Includes relevant terms like 'React components', 'responsive layouts', 'state management', 'frontend', 'UI components', but misses common user variations like 'CSS', 'styling', 'HTML', 'TypeScript', 'JSX', 'web app', or file extensions like '.tsx', '.jsx'. | 2 / 3 |
Distinctiveness Conflict Risk | While it specifies React/Next.js which helps distinguish it, terms like 'frontend issues' and 'UI components' are broad enough to potentially overlap with other frontend-related skills (e.g., a CSS skill, a general web development skill, or a design system skill). | 2 / 3 |
Total | 10 / 12 Passed |
Implementation
0%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill reads as a capability catalog or persona description rather than an actionable skill file. It lists dozens of technologies and concepts Claude already knows without providing any concrete code examples, specific commands, or executable workflows. The content would need a fundamental restructuring to shift from 'what this persona knows' to 'how to perform specific frontend tasks.'
Suggestions
Replace the extensive capability lists with 2-3 concrete, executable code examples showing key patterns (e.g., a Server Component with Suspense, a form with Server Actions, an accessible component with ARIA).
Add a clear multi-step workflow with validation checkpoints, such as: create component → run TypeScript check → test with React Testing Library → audit with Lighthouse → verify accessibility with axe-core.
Extract the technology lists into a separate REFERENCE.md file and keep SKILL.md focused on actionable quick-start patterns and decision trees (e.g., 'When to use Server vs Client Components').
Remove sections like 'Behavioral Traits', 'Knowledge Base', and 'Example Interactions' which describe Claude's persona rather than providing instructions Claude can follow.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | Extremely verbose with extensive lists of technologies, capabilities, and concepts that Claude already knows. The 'Capabilities' section is essentially a resume listing libraries and concepts rather than providing actionable instructions. Most of the content (Knowledge Base, Behavioral Traits, Example Interactions) adds no instructional value. | 1 / 3 |
Actionability | Contains zero executable code, no concrete commands, no specific examples with input/output. The entire skill is abstract descriptions and bullet-point lists of technologies. The 'Instructions' section has only four vague steps like 'Clarify requirements' and 'Implement UI with accessibility.' Nothing is copy-paste ready or directly actionable. | 1 / 3 |
Workflow Clarity | The four-step 'Instructions' workflow is extremely vague ('Choose component structure', 'Validate performance') with no validation checkpoints, no specific commands, and no feedback loops. The 'Response Approach' section lists steps but they are abstract directives, not a clear operational workflow. | 1 / 3 |
Progressive Disclosure | Monolithic wall of text with no references to external files. All content is inline in one massive document with 12+ subsections that could be split into focused reference files. No navigation structure or links to deeper resources. | 1 / 3 |
Total | 4 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
metadata_version | 'metadata.version' is missing | Warning |
Total | 10 / 11 Passed | |
Reviewed
Table of Contents