CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

frontend-developer

Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend architecture.

47

Quality

59%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/frontend-developer/SKILL.md

The canonical home for this skill is frontend-developer in rmyndharis/antigravity-skills

SKILL.md
Quality
Evals
Security

Quality

Content

35%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

This is a persona-style resume of Claude's existing frontend knowledge rather than an instructional skill: it is heavily padded with capability enumerations and provides almost no concrete, executable guidance. The trigger sections and rough workflow sequence are its only real strengths.

Suggestions

Cut the Capabilities, Behavioral Traits, Knowledge Base, and Response Approach sections down to a few lines of instructions Claude doesn't already know; move any needed detail into reference files under references/.

Add at least one concrete artifact: a representative component snippet with TypeScript types and accessibility patterns, or a specific validation command/workflow (e.g. run Lighthouse CI, axe-core scan) with a fix-and-retry loop.

Expand the 4-step Instructions into specific checkpoints, e.g. what to verify after implementing (Lighthouse score thresholds, WCAG checks) and what to do when validation fails.

DimensionReasoningScore

Conciseness

Roughly 100 of 169 lines enumerate knowledge Claude already has ("React 19 features including Actions, Server Components", "CSS Grid and Flexbox mastery", listings of Zustand/SWR/Redux, "Behavioral Traits", "Knowledge Base"), making the body heavily padded. Not 1 because it never prose-explains known concepts and the Use/Do-not-use sections carry genuine value; but it is noticeably below the midpoint since only ~15 lines earn their place.

2 / 5

Actionability

No executable code, commands, or worked examples anywhere; "Example Interactions" lists prompts without outputs, and Instructions/Response Approach are high-level hints ("Choose component structure and state or data approach"). Not 1 because the 4-step Instructions sequence and concrete domains (accessibility, profiling, audits) provide a minimal actionable skeleton.

2 / 5

Workflow Clarity

A sensible 4-step sequence exists (clarify requirements → choose structure → implement → validate with profiling and audits), including a validation step, so it is above 2's 'validation absent'. Below 4 because the validation step is vague with no feedback loop (what to do when audits fail) and steps lack checkpoints or specifics.

3 / 5

Progressive Disclosure

Section headers are clear and navigation within the file is fine, with no nested references (no bundle files exist). However, the ~100-line capability catalog clearly belongs in separate reference files and is inlined, matching 'some structure but content that should be separate is inline' rather than 4's 'most content appropriately placed'.

3 / 5

Total

10

/

20

Passed

Description

66%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A solid description with concrete actions and specific technology triggers, written in third person. Its main weakness is the absence of any 'Use when...' trigger clause, which caps completeness and weakens its value for skill selection.

Suggestions

Append an explicit trigger clause such as "Use when building or debugging React/Next.js UI, fixing frontend performance or accessibility issues, or designing client-side data fetching".

Add natural synonyms users say, e.g. "UI components", "web app", "single-page application", to broaden trigger coverage.

DimensionReasoningScore

Specificity

Lists three concrete actions ("Build React components", "implement responsive layouts", "handle client-side state management") plus specific stack versions, but coverage has minor gaps (no styling, testing, or accessibility terms). Not 5 because the action list is not comprehensive; clearly above 3's '1-2 concrete actions' level.

4 / 5

Completeness

The 'what' is clear (build React components, responsive layouts, state management), but there is no 'Use when...' clause or equivalent explicit trigger guidance. Per the judging guideline, a missing 'Use when' clause caps completeness at 3, so it cannot score 4 despite the solid 'what'.

3 / 5

Trigger Term Quality

Natural terms users would say are present: "React components", "responsive layouts", "client-side state management", "React 19", "Next.js 15", "frontend". Missing common variations like "UI", "web app", or "component library", so not 5; well above 3's 'missing common variations' level.

4 / 5

Distinctiveness Conflict Risk

Naming React 19 and Next.js 15 gives a mostly distinct niche with clear triggers, distinct from backend or design-only skills. Minor overlap risk with general web-development or styling skills keeps it below 5.

4 / 5

Total

15

/

20

Passed

Validation

93%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository

administrakt0r/AI-Agents-Safe-Coding-Skills

Path

skills/frontend-developer/SKILL.md

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.