typescript-rules
React/TypeScript frontend development rules including type safety, component design, state management, and error handling. Use when implementing React components, TypeScript code, or frontend features.
npx skills add shinpr/claude-code-workflows --skill typescript-rules --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# TypeScript Development Rules (Frontend) ## Comment Writing Rules Code first: names and types carry meaning; a comment must add what code cannot, and one comment per decision is enough. - Explain why a component memoizes, guards, or re-renders, not what the JSX renders. - Record decisions and rationale; leave chronological history to version control. ## Type Safety **Default Rule**: Prefer `unknown`, generics, or union types over `any`. Retain `any` only when an existing external, generated, or legacy public signature requires it, or when replacing it prevents the project type check from expressing a safe generic relationship. Record the declaration path or type-check result that proves the constraint. When a local adapter can preserve compatibility and expose a safer type within the user request or current task/design artifact, implement the adapter; otherwise confine `any` to the smallest adapter or public-signature boundary, document the reason, and validate untrusted data before it enters typed application code. **Frontend Boundaries** - React Props/State: use the declared application types. - External API responses: treat unvalidated payloads as `unknown` and validate at the
- Comment Writing Rules
- Type Safety
- Coding Conventions
- Error Handling
- Performance Optimization
- Non-functional Requirements
What does the typescript-rules skill do?
React/TypeScript frontend development rules including type safety, component design, state management, and error handling. Use when implementing React components, TypeScript code, or frontend features.
How do I install it?
Run `npx skills add shinpr/claude-code-workflows --skill typescript-rules --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From shinpr/claude-code-workflows, a repository with 664 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.