---
name: valec3/frontend-typescript-standards
source: https://app.decimal.ai/s/valec3-frontend-typescript-standards@1/SKILL.md
source_sha256: 4a1c4dc0f6e2
---

# 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)