Claude
Skill
typescript-patterns
TypeScript type system patterns, generics, utility types, and strict mode best practices. Use when writing or reviewing TypeScript code.
Virus-scanned
Reviewed automatically before listing.
Download
sabahattink-antigravity-fullstack-hq-skills_typescript-patterns-1acbfa7.zip · 1 KB
Install
skills CLI
npx skills add https://github.com/sabahattink/antigravity-fullstack-hq/tree/main/skills/typescript-patterns
Claude Code
claude plugin marketplace add https://llmmart.ai/marketplace.json && claude plugin install sabahattink-antigravity-fullstack-hq@llmmart
Git
git clone https://github.com/sabahattink/antigravity-fullstack-hq.git
The skills CLI installs just this skill, for any of its supported agents. Claude Code installs the whole sabahattink/antigravity-fullstack-hq collection as a plugin from our marketplace. Git is the plain clone.
Skill manifest
TypeScript Patterns
Core Rules
- Strict mode always (
"strict": true) - No
any— useunknownfor dynamic values - Explicit return types on all functions
constoverlet, nevervar
Type Definitions
Interfaces vs Types
// ✅ Interface for objects/classes (extensible)
interface User {
id: string
email: string
name: string
}
// ✅ Type for unions, primitives, computed
type Status = 'active' | 'inactive' | 'pending'
type UserOrAdmin = User | Admin
type ReadonlyUser = Readonly<User>
Generics
// ✅ Reusable generic types
type ApiResponse<T> = {
data: T
error: string | null
status: number
}
type PaginatedResponse<T> = {
items: T[]
total: number
page: number
limit: number
}
// ✅ Generic functions
const findById = <T extends { id: string }>(items: T[], id: string): T | undefined =>
items.find(item => item.id === id)
Utility Types
// Pick specific fields
type UserPreview = Pick<User, 'id' | 'name'>
// Omit sensitive fields
type PublicUser = Omit<User, 'password' | 'salt'>
// Make all optional (for partial updates)
type UpdateUserDto = Partial<User>
// Make all required
type RequiredUser = Required<User>
// Make all readonly
type FrozenUser = Readonly<User>
// Extract from union
type ActiveStatus = Extract<Status, 'active' | 'pending'>
// Record type
type UserMap = Record<string, User>
Discriminated Unions
// ✅ Type-safe error handling
type Result<T> =
| { success: true; data: T }
| { success: false; error: string }
const processUser = (id: string): Result<User> => {
try {
return { success: true, data: fetchUser(id) }
} catch (e) {
return { success: false, error: 'User not found' }
}
}
// Usage — TypeScript knows the type
const result = processUser('123')
if (result.success) {
console.log(result.data.name) // User
} else {
console.log(result.error) // string
}
Type Guards
// ✅ Custom type guards
const isUser = (value: unknown): value is User =>
typeof value === 'object' &&
value !== null &&
'id' in value &&
'email' in value
// ✅ Assertion functions
const assertDefined = <T>(value: T | null | undefined): T => {
if (value == null) throw new Error('Value is null or undefined')
return value
}
Async Patterns
// ✅ Always type async return values
const fetchUser = async (id: string): Promise<User> => {
const res = await fetch(`/api/users/${id}`)
if (!res.ok) throw new Error('Failed to fetch user')
return res.json() as Promise<User>
}
// ✅ Error handling with unknown
try {
await fetchUser(id)
} catch (error) {
if (error instanceof Error) {
console.error(error.message)
}
}
Forbidden Patterns
// ❌ Never
const data: any = fetchData()
function process(x) { return x } // implicit any
const obj = {} as User // unsafe assertion
// @ts-ignore // suppressing errors
Files (antigravity-fullstack-hq)
-
SKILL.md 3.1 KB
--- name: typescript-patterns description: TypeScript type system patterns, generics, utility types, and strict mode best practices. Use when writing or reviewing TypeScript code. --- # TypeScript Patterns ## Core Rules - Strict mode always (`"strict": true`) - No `any` — use `unknown` for dynamic values - Explicit return types on all functions - `const` over `let`, never `var` ## Type Definitions ### Interfaces vs Types ```typescript // ✅ Interface for objects/classes (extensible) interface User { id: string email: string name: string } // ✅ Type for unions, primitives, computed type Status = 'active' | 'inactive' | 'pending' type UserOrAdmin = User | Admin type ReadonlyUser = Readonly<User> ``` ### Generics ```typescript // ✅ Reusable generic types type ApiResponse<T> = { data: T error: string | null status: number } type PaginatedResponse<T> = { items: T[] total: number page: number limit: number } // ✅ Generic functions const findById = <T extends { id: string }>(items: T[], id: string): T | undefined => items.find(item => item.id === id) ``` ## Utility Types ```typescript // Pick specific fields type UserPreview = Pick<User, 'id' | 'name'> // Omit sensitive fields type PublicUser = Omit<User, 'password' | 'salt'> // Make all optional (for partial updates) type UpdateUserDto = Partial<User> // Make all required type RequiredUser = Required<User> // Make all readonly type FrozenUser = Readonly<User> // Extract from union type ActiveStatus = Extract<Status, 'active' | 'pending'> // Record type type UserMap = Record<string, User> ``` ## Discriminated Unions ```typescript // ✅ Type-safe error handling type Result<T> = | { success: true; data: T } | { success: false; error: string } const processUser = (id: string): Result<User> => { try { return { success: true, data: fetchUser(id) } } catch (e) { return { success: false, error: 'User not found' } } } // Usage — TypeScript knows the type const result = processUser('123') if (result.success) { console.log(result.data.name) // User } else { console.log(result.error) // string } ``` ## Type Guards ```typescript // ✅ Custom type guards const isUser = (value: unknown): value is User => typeof value === 'object' && value !== null && 'id' in value && 'email' in value // ✅ Assertion functions const assertDefined = <T>(value: T | null | undefined): T => { if (value == null) throw new Error('Value is null or undefined') return value } ``` ## Async Patterns ```typescript // ✅ Always type async return values const fetchUser = async (id: string): Promise<User> => { const res = await fetch(`/api/users/${id}`) if (!res.ok) throw new Error('Failed to fetch user') return res.json() as Promise<User> } // ✅ Error handling with unknown try { await fetchUser(id) } catch (error) { if (error instanceof Error) { console.error(error.message) } } ``` ## Forbidden Patterns ```typescript // ❌ Never const data: any = fetchData() function process(x) { return x } // implicit any const obj = {} as User // unsafe assertion // @ts-ignore // suppressing errors ```
Comments (0)
Sign in to join the conversation.
Reviews (0)
No reviews yet.
No comments yet.