React component
Generates complete, production-ready React/TypeScript components using Tailwind CSS. Use when building UI components in a React or Next.js project that requires TypeScript, Tailwind styling, and accessible interactions.From its SKILL.md
npx -y skills add nateslabach/skills --skill react-componentAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 5 stars5 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.6 KB, 291 tokens by cl100k_base, as published. Nobody here has run it
react-component
Generates self-contained React/TypeScript components — plan first, confirm, then produce complete code with no placeholders.
Workflow
- Plan: Present a concise pseudocode implementation plan covering structure, state, and key logic.
- Confirm: Verify requirements and constraints with the user before writing code.
- Code: Write the full implementation. Leave no TODOs, placeholders, or missing pieces.
Code Rules
- Tailwind only — no CSS files, no inline styles. All styling via Tailwind classes.
- Conditional classes — use
clsxor concise template literals; avoid complex nested ternaries. - Handler naming — prefix all event handlers with
handle:handleClick,handleKeyDown. - Early returns — use them wherever they improve readability.
- Accessibility — non-native interactive elements (e.g.,
<div>,<span>) must havetabIndex={0},aria-label,onClick, andonKeyDown. - Types — define prop types explicitly; avoid
any. - Naming — descriptive variable and function names throughout.
Output Format
- One self-contained
.tsxfile with a default export - All imports included, component properly named
- No prose outside the code block in the final answer
- Must compile in a standard React/Next.js project without modification
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.