Skip to main content

TypeScript

This document describes recommended TypeScript usage for both frontend and backend projects in this repository.

Overview​

TypeScript is the preferred language for new frontend and backend services due to its strong tooling, improved maintainability, and type-safety over plain JavaScript.

When to use​

  • Frontend: All new Next.js / React apps.
  • Backend: Node.js services (NestJS, Express) and serverless functions.

Getting started​

Install:

pnpm add -D typescript
pnpm dlx tsc --init

Minimal recommended tsconfig.json settings:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "Node",
    "strict": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "noImplicitAny": true
  }
}
  • Linter & Formatter: ESLint + Prettier with @typescript-eslint parser and rules.
  • Type-aware linting: enable ESLint parserOptions.project for type-aware rules where needed.
  • Runtime helpers: ts-node or build with tsc and run compiled output.

Best practices​

  • Enable strict mode and avoid any when possible.
  • Prefer narrow types and explicit return types for public APIs.
  • Use DTOs / interfaces for boundary types (API inputs/outputs).
  • Keep runtime validation (Zod / io-ts) for external inputs — types are design-time only.

Examples​

Simple typed function:

interface User { id: string; name: string }

function greet(user: User): string {
  return `Hello, ${user.name}`;
}

Using with Prisma (backend): keep Prisma models typed and map them to DTOs where appropriate.

Frontend / Backend notes​

  • Frontend: Integrate with Next.js app router and enable isolatedModules when using Babel.
  • Backend: Use TypeScript with NestJS (recommended) and enable compiler checks in CI.

CI / Build​

  • Run type checks in CI: pnpm dlx tsc --noEmit.
  • Fail builds on type errors when merging into main branches.

Further reading​

  • See the tech-stack doc for framework-level guidance and the frontend / backend docs for architecture-specific conventions.