Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →alinaqi/react-web
React web development with hooks, React Query, Zustand
Passed 23 of 23 test cases with the skill, and 15 of 23 without it.
and 5 more in the full report
8 fixed15 passed either way0 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 8 test cases the skill fixed. Same model, same prompt, with and without the skill.
Where in the project directory structure should pure business domain services and TypeScript domain types be located if they contain no React UI code or JSX?
| Checked | Without skill | With skill |
|---|---|---|
| Places pure domain logic and non-React services in `src/core/`. | Missed | Passed |
The instructions your model reads when the skill loads.
CRITICAL: Tests MUST be written BEFORE implementation code. This is non-negotiable for frontend components.
1. Write test file first → Defines expected behavior
2. Run test (it fails) → Confirms test is valid
3. Write minimal code → Just enough to pass
4. Run test (it passes) → Validates implementation
5. Refactor if needed → Tests catch regressions
# CORRECT ORDER - Test first
1. Create Button.test.tsx # Write tests for expected behavior
2. Run tests (they fail) # npm test -- Button
3. Create Button.tsx # Implement to pass tests
4. Run tests (they pass) # Verify implementation
5. Create Button.module.css # Style after logic works
# WRONG ORDER - Never do this
1. Create Button.tsx # ❌ No tests exist yet
2. Create Button.module.css # ❌ Still no tests
3. "I'll add tests later" # ❌ Tests never get written
// Button.test.tsx - CREATE THIS FIRST
import { render, screen, fireEvent } from '@testing-library/react';
test cases passed, vs 15 / 23 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.