Name: senior-frontend
Rating: 62.4 (1 reviews)
Author: alirezarezvani

senior-frontend

Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications. Use when building React components, optimizing Next.js performance, analyzing bundle sizes, scaffolding frontend projects, implementing accessibility, or reviewing frontend code quality.

Quality

74%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.gemini/skills/senior-frontend/SKILL.md

The canonical home for this skill is senior-frontend in alirezarezvani/claude-skills

Quality

Content

56%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.

The body pairs strong, actionable automation workflows with explicit decision discipline, but is padded by generic React/TypeScript pattern explanations Claude already knows and relies on reference files and scripts that are not present in the bundle.

Suggestions

Move the 'React Patterns' and 'Quick Reference' sections into references/ files and keep only skill-specific guidance in the body to cut known-concept verbosity.

Add a validation/dry-run checkpoint to the Project Scaffolding and Component Generation workflows (e.g., require --dry-run review before writing files).

Create the referenced scripts/, references/, profiles/, and agents/ files — or remove the broken path references — so the signaled progressive-disclosure pointers resolve to real files.

Dimension	Reasoning	Score
Conciseness	Noticeably verbose: large 'React Patterns' (compound components, useDebounce, render props) and 'Quick Reference' (cn(), TypeScript generics) sections re-explain basic concepts Claude already knows, diluting the genuinely skill-specific automation material.	2 / 5
Actionability	Provides concrete, copy-paste-ready commands ('python scripts/frontend_scaffolder.py my-app --template nextjs', the decision engine invocation) and option tables, with only minor gaps; the referenced scripts do not actually exist, but the guidance as written is executable in form.	4 / 5
Workflow Clarity	Multi-step workflows (scaffold, generate component, optimize bundle) are clearly sequenced and the bundle workflow plus forcing-question/Karpathy sections include feedback loops and stop criteria, with only minor validation gaps in the scaffolding workflows.	4 / 5
Progressive Disclosure	Sections are organized with a TOC and clearly signaled one-level-deep reference pointers ('Reference: references/react_patterns.md'), but the referenced files do not exist and content that belongs in those references (React Patterns, Next.js Optimization) is also inlined.	3 / 5
	Total	13 / 20 Passed

Description

92%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 strong, third-person description that concretely names both capabilities and trigger conditions scoped to a specific frontend stack. Minor gains would come from adding file-extension synonyms, but it already answers what and when clearly.

Dimension	Reasoning	Score
Specificity	Lists six concrete actions — 'building React components, optimizing Next.js performance, analyzing bundle sizes, scaffolding frontend projects, implementing accessibility, or reviewing frontend code quality' — giving comprehensive coverage of the skill's capabilities.	5 / 5
Completeness	Explicitly states both what it does ('Frontend development skill for React, Next.js, TypeScript, and Tailwind CSS applications') and when to use it ('Use when building React components...'), with concrete trigger phrases following the anchor.	5 / 5
Trigger Term Quality	Strong natural-term coverage ('React components', 'Next.js performance', 'bundle sizes', 'accessibility') plus the framework names users actually say, but missing common synonyms and file extensions like .tsx or .jsx that would round it out.	4 / 5
Distinctiveness Conflict Risk	Niche is clearly scoped to React/Next.js/TypeScript/Tailwind frontend work with distinct, specific triggers, leaving minimal overlap risk with general web or backend skills.	5 / 5
	Total	19 / 20 Passed

Validation

87%

Warnings & errors only

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

Validation — 14 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (573 lines); consider splitting into references/ and linking	Warning
referenced_paths_exist	Referenced path issues: 21 missing	Warning

	Total	14 / 16 Passed

Repository: alirezarezvani/claude-skills
Path: .gemini/skills/senior-frontend/SKILL.md
Commit: 19392f7

Reviewed: ~14 hours ago

Table of Contents

Discovery Implementation Validation

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.