TypeScript Patterns

Teach TypeScript patterns, generics, and advanced types for safe code.

34|8|Updated Feb 13, 2026
One-click install
npx skills add https://github.com/simkeyur/vscode-agents --skill typescript-patterns-simkeyur
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: TypeScript Patterns
Source: https://github.com/simkeyur/vscode-agents/tree/main/skills/typescript-patterns
Command: npx skills add https://github.com/simkeyur/vscode-agents --skill typescript-patterns-simkeyur

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TypeScript Patterns enables developers to write type-safe, maintainable, and scalable code by teaching advanced type system features, design patterns, and best practices across React, Node.js, and vanilla TypeScript environments.

Core Features & Use Cases

  • Advanced type system techniques: generics, conditional types, mapped types, and template literal types.
  • Robust modeling: discriminated unions, type guards, and type narrowing for runtime safety.
  • Type-safe APIs & data fetching: patterns for API contracts, validation, and error handling.
  • Framework-specific typing strategies: guidance for React and Express/Node ecosystems.
  • Practical refactoring: step-by-step approaches to migrate JavaScript to strongly-typed TypeScript.

Quick Start

Show a concrete example refactoring a small TypeScript snippet to use a generic function with constraints and a discriminated union.

Frequently Asked Questions about TypeScript Patterns

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

FAQPage Schema
How do I use TypeScript generics and discriminated unions to prevent runtime errors?

TypeScript generics and discriminated unions prevent runtime errors by enabling compile-time type narrowing and robust data modeling. You can apply type guards and mapped types to ensure invalid states are unrepresentable across React, Node, and vanilla environments.

What is the best way to define type-safe API contracts and data fetching in React?

The best way to define type-safe API contracts is using TypeScript conditional types and robust validation patterns. This approach ensures your React components receive precisely typed data, preventing fetching errors and improving IDE support.

How do I migrate JavaScript to strongly typed TypeScript step by step?

Migrating JavaScript to strongly typed TypeScript involves step-by-step refactoring to introduce type inference, generics, and type guards. This process incrementally adds type safety to existing codebases, improving maintainability and scalability without breaking functionality.

Can I use advanced TypeScript type guards and mapped types in backend Node services?

Yes, you can use advanced TypeScript type guards and mapped types in backend Node services. These techniques provide precise type inference and type narrowing for API endpoints and data validation, ensuring runtime safety and scalable code.

When should I use template literal types and conditional types in TypeScript?

Template literal types and conditional types should be used when you need to derive new types from existing strings or apply logic based on type conditions. They enable precise typings for complex API structures, preventing runtime errors and improving IDE support.