Individual skill
clean-code-ts-react
Use when writing, reviewing, or refactoring TypeScript or React code for craftsmanship — naming, function and component shape, error handling, data modeling, tests, and abstraction. Translates Robert C. Martin's Clean Code principles into modern TS+React idioms (TS 5.x, React 19), with first-class "When NOT to apply" guidance and a Meta category for principle conflicts (DRY vs SRP, small functions vs deep modules, type safety vs ergonomics). Triggers on code review, refactoring for clarity, naming, function/component design, "is this clean?", "make this more readable", "right abstraction?" — even when the user doesn't say "clean code". Does NOT cover React-specific APIs (RSC, hooks API surface) — use the `react` skill. Does NOT cover TS compiler perf or tsconfig — use the `typescript` skill.
skills/.experimental/clean-code-ts-react/SKILL.md
Source commit cf93c57cac89d6fc3e4194686000411567f5caf3
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- No
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Not checked yet
- Last checked
- Nov 5, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 222
- Repository last updated
- Aug 15, 2026
- License
- MIT
Observed agent integration: codex
- design Derived category
- writing Derived category
- data Derived category
- engineering Derived category
- engineering-web Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
AGENTS.mddoc · 13,772 bytesSKILL.mdcore · 12,481 bytesSKILL.mdcore · 12,481 bytesassets/templates/_template.mddoc · 1,498 bytesmetadata.jsonasset · 1,601 bytesreferences/_sections.mddoc · 4,292 bytesreferences/bound-isolate-framework.mddoc · 2,762 bytesreferences/bound-learning-tests.mddoc · 2,709 bytesreferences/bound-type-assertions-at-edges.mddoc · 2,426 bytesreferences/bound-wrap-third-party-hooks.mddoc · 2,447 bytesreferences/comp-avoid-hoc-stacks.mddoc · 2,338 bytesreferences/comp-children-over-props.mddoc · 2,666 bytesreferences/comp-context-only-when-needed.mddoc · 3,029 bytesreferences/comp-render-props-vs-hooks.mddoc · 2,776 bytesreferences/comp-separate-construction-from-use.mddoc · 2,580 bytesreferences/comp-small-components.mddoc · 2,679 bytesreferences/data-branded-types.mddoc · 2,556 bytesreferences/data-demeter-prop-drilling.mddoc · 2,669 bytesreferences/data-discriminated-unions-over-flags.mddoc · 2,621 bytesreferences/data-dto-vs-domain.mddoc · 2,520 bytesreferences/data-readonly-by-default.mddoc · 2,328 bytesreferences/data-structural-typing-pitfalls.mddoc · 2,728 bytesreferences/doc-avoid-redundant-comments.mddoc · 2,235 bytesreferences/doc-delete-commented-out-code.mddoc · 2,339 bytesreferences/doc-jsdoc-public-api.mddoc · 2,794 bytesreferences/doc-satisfies-narrows-with-check.mddoc · 2,371 bytesreferences/doc-types-over-comments.mddoc · 2,100 bytesreferences/emerge-four-rules.mddoc · 2,466 bytesreferences/emerge-premature-abstraction.mddoc · 2,758 bytesreferences/emerge-reveal-intent.mddoc · 1,942 bytesreferences/emerge-yagni-types.mddoc · 2,573 bytesreferences/err-early-return.mddoc · 2,501 bytesreferences/err-error-boundaries.mddoc · 2,762 bytesreferences/err-narrow-unknown.mddoc · 2,356 bytesreferences/err-no-swallow.mddoc · 2,399 bytesreferences/err-null-vs-undefined.mddoc · 2,829 bytesreferences/err-result-vs-throw.mddoc · 2,655 bytesreferences/err-suspense-for-loading.mddoc · 2,980 bytesreferences/fmt-imports-grouped.mddoc · 2,098 bytesreferences/fmt-newspaper-order.mddoc · 2,655 bytesreferences/fmt-team-rules-over-preference.mddoc · 2,849 bytesreferences/fmt-vertical-density.mddoc · 2,656 bytesreferences/func-abstraction-level.mddoc · 2,582 bytesreferences/func-command-query-separation.mddoc · 3,144 bytesreferences/func-custom-hook-extract.mddoc · 4,329 bytesreferences/func-dry.mddoc · 4,002 bytesreferences/func-minimize-arguments.mddoc · 2,834 bytesreferences/func-no-side-effects.mddoc · 2,925 bytesreferences/func-one-thing.mddoc · 2,821 bytesreferences/func-small.mddoc · 3,498 bytesreferences/meta-dry-vs-srp.mddoc · 2,927 bytesreferences/meta-small-vs-deep.mddoc · 3,292 bytesreferences/meta-tests-as-spec-vs-doc.mddoc · 3,165 bytesreferences/meta-types-vs-ergonomics.mddoc · 2,603 bytesreferences/name-avoid-disinformation.mddoc · 2,675 bytesreferences/name-boolean-predicate.mddoc · 2,780 bytesreferences/name-component-pascal-case.mddoc · 2,719 bytesreferences/name-handler-convention.mddoc · 2,669 bytesreferences/name-hook-use-prefix.mddoc · 2,968 bytesreferences/name-intention-revealing.mddoc · 2,200 bytesreferences/name-meaningful-distinctions.mddoc · 2,398 bytesreferences/name-types-pascal-case.mddoc · 2,568 bytesreferences/test-behavior-not-implementation.mddoc · 2,892 bytesreferences/test-clean-as-production.mddoc · 2,248 bytesreferences/test-first-principles.mddoc · 2,895 bytesreferences/test-mock-at-boundaries.mddoc · 2,696 bytesreferences/test-one-concept.mddoc · 3,182 bytes
Read excerpt
# Robert C. Martin (Uncle Bob) TypeScript 5.x + React 19 Best Practices
Craftsmanship principles from Robert C. Martin's *Clean Code* (2008), re-expressed for modern TypeScript and React. Contains **61 rules across 11 categories**, prioritized by cognitive cost across a code change's lifetime. Examples use TS 5.x and React 19 idioms — but the rules are about timeless principles, not specific APIs.
## What Makes This Skill Different
Three things set this apart from a generic clean-code copy:
1. **Modern idioms as vehicle.** Examples use TS 5.x (`satisfies`, branded types, discriminated unions, `const` type parameters) and React 19 (function components, hooks, `use()`, Server Components where relevant). But the rule is always the principle, never the syntax.
2. **"When NOT to apply" is first-class.** Every rule has 2-3 concrete scenarios where the principle should bend — not generic disclaimers, real situations. Loop counters can be `i`. Single-use code shouldn't be DRY. Some HOCs are unavoidable.
3. **Meta category for principle conflicts.** Category 11 names the most common tensions explicitly — DRY vs Single Responsibility, small functions vs deep modules (Ousterhout), type precision vs ergonomic APIs, tests as spec vs documentation. The mark of seniority is knowing which to bend.
## When to Apply