typescript-simplification-patterns

Identify and apply TypeScript/React simplification patterns during code reviews.

1|Updated Dec 17, 2025
One-click install
npx skills add https://github.com/JonnyCBB/claude-code-config --skill typescript-simplification-patterns
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: typescript-simplification-patterns
Source: https://github.com/JonnyCBB/claude-code-config/tree/main/plugins/jbb-feature-dev/skills/typescript-simplification-patterns
Command: npx skills add https://github.com/JonnyCBB/claude-code-config --skill typescript-simplification-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides concrete before/after code transformations to improve TypeScript and React code quality, highlighting common anti-patterns and modern language patterns.

Core Features & Use Cases

  • Anti-patterns to avoid (e.g., any, type assertions, non-null assertions) with safer alternatives.
  • Modern TypeScript features (5.x): satisfies, const type parameters, inferred type predicates, and iterator helpers.
  • React patterns for 18/19: functional components, hooks, events, context, and ref usage patterns.
  • Conventions and guidelines to standardize codebases across teams.
  • Use Case: during code reviews to identify refactoring opportunities and improve maintainability.

Quick Start

Review your TypeScript/React codebase and apply these patterns to simplify code and improve maintainability.

Frequently Asked Questions about typescript-simplification-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I identify TypeScript anti-patterns during a code review?

TypeScript anti-patterns like any, type assertions, and non-null assertions can be identified during code reviews by applying safer alternatives. This refactoring process improves overall code quality and project maintainability using modern features.

What is the TypeScript satisfies operator and when should I use it?

The TypeScript satisfies operator is a modern 5.x feature that ensures an expression matches a type without losing its precise inferred type. It is used during refactoring to replace unsafe type assertions.

How do I simplify React 18 and 19 components with modern patterns?

Simplify React 18 and 19 components by adopting modern patterns like the use() hook, Actions, and passing ref as a prop. These patterns streamline functional component logic and event handling.

What is the best way to refactor non-null assertions in TypeScript?

The best way to refactor non-null assertions in TypeScript is to replace them with safer alternatives like inferred type predicates or modern 5.x const type parameters. This eliminates anti-patterns and improves type safety.

Can I use const type parameters to simplify generic TypeScript functions?

Yes, you can use const type parameters to simplify generic TypeScript functions. This modern 5.x feature allows for better type inference without relying on explicit type annotations or unsafe assertions.