본문으로 건너뛰기
cccskills
무료GitHub에 공개

typescript-pro

Design TypeScript types and APIs that catch mistakes such as mixed-up identifiers and missing state handling. Implement reusable types and runtime checks that narrow types, configure tRPC for shared client-server types, and improve compiler settings.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

원문원문 설명 보기

Implements advanced TypeScript type systems, creates custom type guards, utility types, and branded types, and configures tRPC for end-to-end type safety. Use when building TypeScript applications requiring advanced generics, conditional or mapped types, discriminated unions, monorepo setup, or full-stack type safety with tRPC.

설치 방법 보기

이럴 때 유용합니다

  • Prevent identifier mix-ups with distinct types
  • Model application states and handle every case
  • Create reusable types for complex data
  • Share types between client and server with tRPC
  • Review monorepo compiler and build settings

포함된 파일(6)

  • SKILL.md5.5 KB
  • references/advanced-types.md6.3 KB
  • references/configuration.md8.8 KB
  • references/patterns.md11.0 KB
  • references/type-guards.md7.7 KB
  • references/utility-types.md8.4 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

TypeScript Pro

Core Workflow

  1. Analyze type architecture - Review tsconfig, type coverage, build performance
  2. Design type-first APIs - Create branded types, generics, utility types
  3. Implement with type safety - Write type guards, discriminated unions, conditional types; run tsc --noEmit to catch type errors before proceeding
  4. Optimize build - Configure project references, incremental compilation, tree shaking; re-run tsc --noEmit to confirm zero errors after changes
  5. Test types - Confirm type coverage with a tool like type-coverage; validate that all public APIs have explicit return types; iterate on steps 3–4 until all checks pass

Reference Guide

Load detailed guidance based on context:

TopicReferenceLoad When
Advanced Typesreferences/advanced-types.mdGenerics, conditional types, mapped types, template literals
Type Guardsreferences/type-guards.mdType narrowing, discriminated unions, assertion functions
Utility Typesreferences/utility-types.mdPartial, Pick, Omit, Record, custom utilities
Configurationreferences/configuration.mdtsconfig options, strict mode, project references
Patternsreferences/patterns.mdBuilder pattern, factory pattern, type-safe APIs

Code Examples

Branded Types

// Branded type for domain modeling
type Brand<T, B extends string> = T & { readonly __brand: B };
type UserId  = Brand<string, "UserId">;
type OrderId = Brand<number, "OrderId">;

const toUserId  = (id: string): UserId  => id as UserId;
const toOrderId = (id: number): OrderId => id as OrderId;

// Usage — prevents accidental id mix-ups at compile time
function getOrder(userId: UserId, orderId: OrderId) { /* ... */ }

Discriminated Unions & Type Guards

type LoadingState = { status: "loading" };
type SuccessState = { status: "success"; data: string[] };
type ErrorState   = { status: "error";   error: Error };
type RequestState = LoadingState | SuccessState | ErrorState;

// Type predicate guard
function isSuccess(state: RequestState): state is SuccessState {
  return state.status === "success";
}

// Exhaustive switch with discriminated union
function renderState(state: RequestState): string {
  switch (state.status) {
    case "loading": return "Loading…";
    case "success": return state.data.join(", ");
    case "error":   return state.error.message;
    default: {
      const _exhaustive: never = state;
      throw new Error(`Unhandled state: ${_exhaustive}`);
    }
  }
}

Custom Utility Types

// Deep readonly — immutable nested objects
type DeepReadonly<T> = {
  readonly [K in keyof T]: T[K] extends object ? DeepReadonly<T[K]> : T[K];
};

// Require exactly one of a set of keys
type RequireExactlyOne<T, Keys extends keyof T = keyof T> =
  Pick<T, Exclude<keyof T, Keys>> &
  { [K in Keys]-?: Required<Pick<T, K>> & Partial<Record<Exclude<Keys, K>, never>> }[Keys];

Recommended tsconfig.json

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "noImplicitOverride": true,
    "exactOptionalPropertyTypes": true,
    "isolatedModules": true,
    "declaration": true,
    "declarationMap": true,
    "incremental": true,
    "skipLibCheck": false
  }
}

Constraints

MUST DO

  • Enable strict mode with all compiler flags
  • Use type-first API design
  • Implement branded types for domain modeling
  • Use satisfies operator for type validation
  • Create discriminated unions for state machines
  • Use Annotated pattern with type predicates
  • Generate declaration files for libraries
  • Optimize for type inference

MUST NOT DO

  • Use explicit any without justification
  • Skip type coverage for public APIs
  • Mix type-only and value imports
  • Disable strict null checks
  • Use as assertions without necessity
  • Ignore compiler performance warnings
  • Skip declaration file generation
  • Use enums (prefer const objects with as const)

Output Templates

When implementing TypeScript features, provide:

  1. Type definitions (interfaces, types, generics)
  2. Implementation with type guards
  3. tsconfig configuration if needed
  4. Brief explanation of type design decisions

Knowledge Reference

TypeScript 5.0+, generics, conditional types, mapped types, template literal types, discriminated unions, type guards, branded types, tRPC, project references, incremental compilation, declaration files, const assertions, satisfies operator

Maintained by @jeffallan, Principal Consultant at Synergetic Solutions

Documentation

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Build Angular 17+ applications with standalone components, routing, and shared application state. Covers reactive data handling with RxJS, performance improvements, and unit and integration tests, with code and explanations of architecture choices.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Building Angular screens with standalone components
  • Managing shared application state with NgRx
  • Configuring lazy-loaded routes and access guards
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Design REST or GraphQL APIs by defining data relationships, requests, responses, and authentication. Produce OpenAPI specifications, machine-readable API descriptions, with consistent errors, pagination, and versioning plans, then validate contracts using a mock server.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Designing a new API from business requirements
  • Creating and validating OpenAPI specifications
  • Standardizing errors and paginated responses
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Design or review a system’s overall structure, compare technology choices, and plan for growth and failures. Produce architecture diagrams and Architecture Decision Records, documents that explain key choices, alternatives, and their consequences.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Designing the overall structure of a new system
  • Comparing monolith and microservices architectures
  • Recording technology decisions and alternatives
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Connect AI agents to Jira and Confluence through MCP, a protocol for accessing external tools. This skill guides issue searches and updates, page management, sprint workflows, authentication setup, and troubleshooting of Atlassian integrations.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Find Jira issues by assignee or status
  • Search and update Confluence pages
  • Turn meeting notes into Jira ticket updates
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Design controlled failure experiments for distributed systems to examine how services recover. Produce failure injection scripts, monitoring plans, rollback procedures, and exercise guides, then turn findings into documented improvements.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Planning controlled failure experiments
  • Testing recovery after Kubernetes Pod failures
  • Checking service behavior under network delays
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Design and implement command-line tools with subcommands, options, interactive prompts, and progress indicators. Get command structures, configuration handling, clear error messages, and shell completion scripts, with guidance for automated use and testing across operating systems.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Build a command-line tool with subcommands and options
  • Add interactive prompts and progress indicators
  • Provide bash, zsh, and fish command completion
Jeffallan/claude-skills1.2만2026년 10월 17일 업데이트

Jeffallan의 스킬 모두 보기

이 스킬의 문제 신고