react-component-generator
React Component Generator - Auto-activating skill for Frontend Development. Triggers on: react component generator, react component generator Part of the Frontend Development skill category.
36
Quality
3%
Does it follow best practices?
Impact
100%
1.04xAverage score across 3 eval scenarios
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./planned-skills/generated/05-frontend-dev/react-component-generator/SKILL.mdQuality
Discovery
7%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 description is essentially a template placeholder with minimal useful content. It lacks concrete actions, meaningful trigger terms, and explicit usage guidance. The redundant trigger term and boilerplate structure provide almost no information for Claude to make informed skill selection decisions.
Suggestions
Add specific actions the skill performs, e.g., 'Generates React functional components with TypeScript support, creates component boilerplate with props interfaces, adds styling scaffolding'
Include a 'Use when...' clause with natural trigger scenarios, e.g., 'Use when the user asks to create a new React component, needs component boilerplate, or mentions JSX, functional components, or React UI elements'
Expand trigger terms to include natural variations: 'react component', 'new component', 'create component', 'jsx', 'functional component', 'component template'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | The description only states 'React Component Generator' without listing any concrete actions. It doesn't specify what the skill actually does - no mention of creating components, generating boilerplate, handling props, styling, etc. | 1 / 3 |
Completeness | The description fails to answer 'what does this do' beyond the title, and has no explicit 'Use when...' clause. The 'Triggers on' section is not a proper when-to-use guidance, just repeated keywords. | 1 / 3 |
Trigger Term Quality | The trigger terms are redundant ('react component generator' listed twice) and overly specific. Missing natural variations users would say like 'create react component', 'new component', 'jsx', 'functional component', 'class component'. | 1 / 3 |
Distinctiveness Conflict Risk | While 'React Component Generator' is somewhat specific to React, the lack of detail about what kind of components or what actions it performs could cause overlap with other frontend or React-related skills. | 2 / 3 |
Total | 5 / 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 is an empty template with no actual content about React component generation. It contains only meta-descriptions of what a skill should do without any concrete guidance, code examples, component patterns, or actionable instructions. The entire content could be replaced with a single sentence: 'This skill helps with React components' - it adds no value beyond that.
Suggestions
Add executable React component code examples (functional components, hooks usage, TypeScript interfaces) that Claude can directly use or adapt
Include a concrete workflow for component generation: 1) Analyze requirements, 2) Choose component pattern, 3) Generate code, 4) Add tests, 5) Validate accessibility
Provide specific component templates or patterns (e.g., form components, data display components, layout components) with copy-paste ready code
Remove all meta-description content ('This skill provides...', 'When to Use...') and replace with actual technical guidance about React component best practices
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is entirely boilerplate with no actual technical substance. It explains what the skill does in abstract terms without providing any concrete React component generation guidance, wasting tokens on meta-description rather than actionable content. | 1 / 3 |
Actionability | No executable code, no concrete commands, no specific examples of React component patterns. The content describes rather than instructs - phrases like 'Provides step-by-step guidance' without actually providing any steps. | 1 / 3 |
Workflow Clarity | No workflow is defined. There are no steps, no sequence, no validation checkpoints. The skill claims to provide 'step-by-step guidance' but contains zero actual steps for generating React components. | 1 / 3 |
Progressive Disclosure | No structure beyond generic headings. No references to detailed materials, no examples, no links to component templates or patterns. The content is a shallow placeholder with no depth or navigation to additional resources. | 1 / 3 |
Total | 4 / 12 Passed |
Validation
81%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 9 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
allowed_tools_field | 'allowed-tools' contains unusual tool name(s) | Warning |
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 9 / 11 Passed | |
- Commit
994edc4
- 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.