frontend-developer
Expert frontend developer specializing in modern web technologies, React/Vue/Angular frameworks, UI implementation, and performance optimization
35
19%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./frontend-developer/skills/SKILL.mdQuality
Discovery
25%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
The description reads more like a resume headline than a skill description. It uses a persona-style framing ('Expert frontend developer specializing in...') rather than describing concrete actions the skill performs, and it completely lacks trigger guidance for when Claude should select it. The broad scope covering multiple frameworks and general frontend work makes it highly prone to conflicts with other skills.
Suggestions
Add an explicit 'Use when...' clause specifying trigger conditions, e.g., 'Use when the user asks to build UI components, debug CSS/HTML issues, or optimize frontend performance in React, Vue, or Angular projects.'
Replace the persona framing with concrete action verbs describing what the skill does, e.g., 'Builds and debugs frontend components, implements responsive layouts, optimizes bundle size and rendering performance.'
Consider narrowing the scope or adding more specific trigger terms like 'CSS', 'HTML', 'JavaScript', 'component', 'responsive', 'webpack', 'styling' to improve both trigger quality and distinctiveness.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (frontend development) and mentions some areas like React/Vue/Angular frameworks, UI implementation, and performance optimization, but these are broad categories rather than concrete actions. No specific verbs describing what the skill does (e.g., 'builds components', 'debugs CSS', 'optimizes bundle size'). | 2 / 3 |
Completeness | Describes a vague 'what' (specializing in frontend technologies) but completely lacks any 'when' clause or explicit trigger guidance. There is no 'Use when...' or equivalent, which per the rubric should cap completeness at 2, and the 'what' itself is weak enough to warrant a 1. | 1 / 3 |
Trigger Term Quality | Includes some relevant keywords users might say like 'React', 'Vue', 'Angular', 'frontend', 'UI', and 'performance optimization'. However, it misses many common variations like 'CSS', 'HTML', 'JavaScript', 'responsive design', 'component', 'styling', 'layout', 'web app', etc. | 2 / 3 |
Distinctiveness Conflict Risk | Very broad scope covering all of frontend development across three major frameworks plus general UI and performance. This would easily conflict with any other web development, JavaScript, CSS, or framework-specific skills. | 1 / 3 |
Total | 6 / 12 Passed |
Implementation
14%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 high-level role description or persona prompt rather than an actionable skill document. It lacks any concrete code examples, specific commands, executable patterns, or detailed workflows that would help Claude perform frontend development tasks. The content describes what a frontend developer does rather than instructing Claude how to do it.
Suggestions
Add concrete, executable code examples for common tasks (e.g., a React component template with accessibility built in, a performance optimization snippet, a Tailwind configuration pattern).
Replace the abstract workflow steps with specific, sequenced instructions including validation checkpoints (e.g., 'Run `npx lighthouse` and verify LCP < 2.5s before proceeding').
Include specific patterns and anti-patterns with before/after code examples rather than listing general principles.
Add references to separate detail files for framework-specific guidance (e.g., 'See [REACT_PATTERNS.md](REACT_PATTERNS.md) for component architecture') to enable progressive disclosure.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is reasonably organized but includes broad capability listings and generic statements that don't add value beyond what Claude already knows. Phrases like 'Build responsive, accessible, and performant interfaces that feel polished under real user conditions' are aspirational rather than instructive. | 2 / 3 |
Actionability | The skill contains no concrete code, commands, specific examples, or executable guidance. It reads as a role description or persona definition rather than actionable instructions. There are no code snippets, specific patterns, or copy-paste-ready templates. | 1 / 3 |
Workflow Clarity | The workflow section lists high-level phases (define, build, integrate, optimize, validate) but provides no specific steps, commands, validation checkpoints, or feedback loops. Each step is abstract and could apply to any software project. | 1 / 3 |
Progressive Disclosure | The content is a monolithic document with no references to external files, no links to detailed guides, and no layered structure. Everything is at the same level of abstraction with no navigation aids or pointers to deeper resources. | 1 / 3 |
Total | 5 / 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 |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
- Repository
- OpenRoster-ai/awesome-openroster
- Commit
09aef5d
- Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.