Skip to main content
Back to blog

Why TypeScript is worth the setup cost

·4 min readWeb Dev

I resisted TypeScript for longer than I should have. JavaScript was fine, I could move fast, and the type system felt like unnecessary ceremony. Then I worked on a project with 50+ files and spent an entire afternoon debugging a bug that TypeScript would have caught in the editor before I even ran the code.

What TypeScript actually prevents

The sales pitch is "types catch bugs." That is true but vague. Here is what it actually prevents in day-to-day work:

Typos in property names. Access user.emial instead of user.email and TypeScript tells you immediately. In JavaScript, you get undefined and spend 20 minutes figuring out why.

Wrong argument types. Pass a string where a function expects a number and TypeScript catches it. In JavaScript, the function silently coerces the value and produces wrong results.

Missing null checks. TypeScript's strict mode forces you to handle cases where a value might be null or undefined. These are the errors that crash production apps at 2 AM.

// TypeScript catches this
function getUser(id: string): User | null {
  return db.findUser(id);
}
 
const user = getUser("123");
console.log(user.name); // Error: 'user' is possibly null
 
// You are forced to handle it
const user = getUser("123");
if (user) {
  console.log(user.name); // Safe
}

The IDE experience

This is where TypeScript really shines. With types, your editor can:

  • Autocomplete property names and function arguments
  • Show documentation on hover without leaving the editor
  • Refactor safely by renaming a variable and having every reference update
  • Navigate to definitions and find all references instantly

In a JavaScript project, your editor is guessing. In a TypeScript project, it knows. The productivity difference grows with the size of the codebase.

The setup is minimal now

TypeScript used to require significant configuration. With modern tools, the setup is almost invisible:

Next.js supports TypeScript out of the box. Create a .tsx file and it works.

Vite has built-in TypeScript support. No configuration needed.

Node.js (since v23) can run TypeScript files directly with --experimental-strip-types.

The tsconfig.json file is the only configuration, and the defaults from npx tsc --init are sensible for most projects.

Start gradually

You do not need to type everything on day one. TypeScript is a superset of JavaScript, so you can:

  1. Rename .js files to .ts (they still work)
  2. Add types to function parameters and return values first
  3. Enable strict mode later when you are comfortable
// Start simple - just add parameter and return types
function calculateTotal(items: CartItem[]): number {
  return items.reduce((sum, item) => sum + item.price * item.quantity, 0);
}

The honest downsides

Build step. TypeScript needs to be compiled. For most projects this is handled by your bundler (Vite, Next.js, esbuild) and adds negligible build time.

Generic types are hard. When you start writing utility types or working with complex generics, the type system can feel like its own programming language. For application code, you rarely need advanced generics.

Third-party types. Some npm packages have poor or missing type definitions. The @types/ ecosystem covers most popular packages, but occasionally you need to write your own declarations.

When to use it

For any project you expect to maintain for more than a few weeks, TypeScript is worth it. The initial setup cost is a few minutes. The ongoing cost is writing type annotations (which double as documentation). The payoff is fewer bugs, better refactoring, and a faster development experience.

For a quick script or prototype that you will throw away, plain JavaScript is fine. But in my experience, "quick prototype" has a tendency to become "production code" faster than you expect.

Sources

Enjoying the blog? Subscribe via RSS to get new posts in your reader.

Subscribe via RSS