# Frontend Typescript Standards

> Standardized guidelines and patterns for Frontend Typescript Standards.

- Skill: `valec3/frontend-typescript-standards` (Agent Skill)
- Install (CLI): `npx skillmds add valec3/frontend-typescript-standards`
- Raw SKILL.md: https://api.skillmd.com/api/skills/valec3/frontend-typescript-standards/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: valec3 (https://skillmd.com/u/valec3)
- Updated: 2026-09-10
- Page: https://skillmd.com/skills/valec3/frontend-typescript-standards

---


# Frontend Typescript Standards

## When to use this skill
- Setting up TypeScript in a new project
- Establishing coding standards
- Code reviews for TypeScript quality

## Workflow
- [ ] Enable strict mode in tsconfig.json
- [ ] Use interfaces for object shapes
- [ ] Prefer `type` for unions and intersections
- [ ] Always type function parameters and returns
- [ ] Avoid `any`, use `unknown` instead

## Instructions

### tsconfig.json
```json
{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true
  }
}
```

### Naming Conventions
- Interfaces: PascalCase with `I` prefix optional
- Types: PascalCase
- Enums: PascalCase
- Generics: Single capital letter or PascalCase

### Type vs Interface
```typescript
// Use interface for object shapes
interface User {
  id: string;
  name: string;
}

// Use type for unions, intersections
type Status = 'pending' | 'active' | 'inactive';
type Admin = User & { role: 'admin' };
```

## Resources
- Enable all strict flags
- Type everything explicitly
- Use utility types (Partial, Pick, Omit)