Use when writing TypeScript code, implementing TypeScript features, or needing TypeScript best practices and idioms.
From psnnpx claudepluginhub aladac/claude-pluginsThis skill uses the workspace's default tool permissions.
Guides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.
Migrates code, prompts, and API calls from Claude Sonnet 4.0/4.5 or Opus 4.1 to Opus 4.5, updating model strings on Anthropic, AWS, GCP, Azure platforms.
Optimizes cloud costs on AWS, Azure, GCP via rightsizing, tagging strategies, reserved instances, spot usage, and spending analysis. Use for expense reduction and governance.
| Tool | Purpose |
|---|---|
Read | Read .ts files |
Write | Create new TypeScript files |
Edit | Modify TypeScript code |
Bash | Run tsc, npm, npx, vitest, eslint, prettier |
Glob | Find TypeScript files (*.ts) |
Grep | Search TypeScript code |
psn:code:typescript-cli - Commander.js CLI developmentpsn:code:typescript-test - Vitest testingpsn:code:typescript-tooling - Lint/format/typecheckpsn:code:typescript-validate - Full validation workflowModern TypeScript idioms focused on type safety and readability.
{
"compilerOptions": {
"strict": true,
"noUncheckedIndexedAccess": true,
"noImplicitReturns": true,
"exactOptionalPropertyTypes": true,
"noPropertyAccessFromIndexSignature": true
}
}
type RequestState<T> =
| { status: 'idle' }
| { status: 'loading' }
| { status: 'success'; data: T }
| { status: 'error'; error: Error };
function render(state: RequestState<User>) {
switch (state.status) {
case 'idle': return <Placeholder />;
case 'loading': return <Spinner />;
case 'success': return <UserCard user={state.data} />;
case 'error': return <ErrorMessage error={state.error} />;
}
}
const roles = ['admin', 'user', 'guest'] as const;
type Role = (typeof roles)[number]; // 'admin' | 'user' | 'guest'
function isAdmin(person: User | Admin): person is Admin {
return person.type === 'admin';
}
// Assertion Functions
function assertIsString(value: unknown): asserts value is string {
if (typeof value !== 'string') {
throw new Error(`Expected string, got ${typeof value}`);
}
}
import { z } from 'zod';
const UserSchema = z.object({
id: z.string().uuid(),
email: z.string().email(),
name: z.string().min(1).max(100),
role: z.enum(['admin', 'user', 'guest']),
});
type User = z.infer<typeof UserSchema>;
// Parsing
function parseUser(data: unknown): User {
return UserSchema.parse(data);
}
type UserUpdate = Partial<User>;
type UserPreview = Pick<User, 'id' | 'name'>;
type PublicUser = Omit<User, 'password'>;
type ImmutableUser = Readonly<User>;
type UserById = Record<string, User>;
any// Bad: any disables type checking
function parse(json: string): any { ... }
// Better: unknown requires narrowing
function parse(json: string): unknown { ... }
// Best: validate into known type
function parseUser(json: string): User {
const data = JSON.parse(json);
return UserSchema.parse(data);
}
type Result<T, E = Error> =
| { ok: true; value: T }
| { ok: false; error: E };
function divide(a: number, b: number): Result<number, string> {
if (b === 0) {
return { ok: false, error: 'Division by zero' };
}
return { ok: true, value: a / b };
}
import type { User, Order } from './models';
import { createUser } from './services';
// lib/models/index.ts
export { User, type UserCreate } from './user';
export { Order, type OrderItem } from './order';
class Order {
private constructor(
public readonly id: string,
public readonly items: OrderItem[],
) {}
static create(items: OrderItem[]): Order {
return new Order(crypto.randomUUID(), items);
}
static fromJson(data: unknown): Order {
const parsed = OrderSchema.parse(data);
return new Order(parsed.id, parsed.items);
}
}