Introduction to TypeScript

TypeScript is a programming language created by Anders Hejlsberg at Microsoft and released as open source in October 2012. It is a typed superset of JavaScript — meaning every valid JavaScript program is also a valid TypeScript program — with one powerful addition: a static type system.

Where JavaScript lets you run any code and only discover type mistakes at runtime (often in production), TypeScript checks your program before it runs, catching an entire class of bugs at the moment you type them.

The Problem TypeScript Solves

Consider this innocent-looking JavaScript function:

// JavaScript — no types, no warnings
function getUserName(user) {
  return user.profile.name.toUpperCase();
}

getUserName(null); // TypeError: Cannot read properties of null

TypeError: Cannot read properties of null (reading 'profile')

This crash only appears at runtime — possibly in production, after a real user triggers it. Now look at the same code in TypeScript:

// TypeScript — type error caught at compile time
interface User {
  profile: {
    name: string;
  };
}

function getUserName(user: User): string {
  return user.profile.name.toUpperCase();
}

getUserName(null);
// Error: Argument of type 'null' is not assignable to parameter of type 'User'

Success

TypeScript caught the bug before the program ever ran. This is the core value proposition: move errors from runtime to compile time.

A Brief History

TypeScript was born out of frustration with large-scale JavaScript development.

2010 — Microsoft's internal teams struggled to build and maintain Bing Maps and Office Web Apps in JavaScript at scale. Anders Hejlsberg (creator of C# and Turbo Pascal) began working on a typed layer over JavaScript.
October 2012 — TypeScript 0.8 released publicly. Initial reception was cautious; the JavaScript community had seen typed-JS experiments before.
2014 — TypeScript 1.0 ships; Angular 2 (Google) adopts TypeScript as its primary language, dramatically raising the profile of the project.
2016 — TypeScript 2.0 introduces non-nullable types, one of its most impactful features.
2019 — AirBnb, Slack, Lyft, and dozens of other major companies publish migration stories. The State of JS survey shows TypeScript as the most-loved compile-to-JS language.
2020–present — TypeScript consistently ranks in the top 5 most popular languages on GitHub. The ecosystem has embraced it: React, Vue, Angular, Node.js, Deno, Bun, and most major libraries ship with first-class TypeScript support.

Note

Anders Hejlsberg designed TypeScript to feel like a natural evolution of JavaScript, not a replacement. Every feature integrates smoothly with existing JS code.

TypeScript as a Superset of JavaScript

The "superset" relationship is worth understanding precisely:

Every valid .js file is also a valid .ts file (with zero changes)
TypeScript adds optional type annotations on top of JavaScript syntax
You can adopt TypeScript gradually — rename one file at a time from .js to .ts
The TypeScript compiler (tsc) outputs plain JavaScript — browsers and Node.js never see the .ts source
At runtime, TypeScript types are completely erased — they add zero overhead

// Pure JavaScript — also valid TypeScript
const greeting = 'Hello, world!';
console.log(greeting);

// TypeScript additions — optional type annotations
const name: string = 'Alice';
const age: number = 30;

function greet(person: string): string {
  return `Hello, ${person}!`;
}

Static Typing vs Dynamic Typing

Understanding this distinction is the mental model shift that makes TypeScript click:

	Dynamic Typing (JavaScript)	Static Typing (TypeScript)
When types are checked	At runtime	At compile time (before running)
Type errors discovered	When code executes	When you save the file
Type annotations	None — optional JSDoc	Inline syntax: name: string
IDE support	Limited (guessed)	Full autocomplete + type checking
Refactoring safety	Manual	Compiler finds all broken references

In a dynamically typed language like JavaScript, a variable can hold any value at any time. The type is checked when the code actually runs. In a statically typed language, you declare (or the compiler infers) the type at the time you write the code, and the compiler verifies consistency before execution.

The Compilation Step

TypeScript introduces a build step that plain JavaScript does not have. You write .ts files, then compile them to .js files using the TypeScript compiler (tsc):

You write src/index.ts with type annotations
You run: npx tsc
tsc reads your .ts files, checks all types, and emits dist/index.js
Node.js / the browser executes dist/index.js — it never sees the .ts source
Type errors abort compilation so broken code never reaches production

Bash

# Compile a single file
npx tsc index.ts

# Compile an entire project (uses tsconfig.json)
npx tsc

# Watch mode — recompile on every save
npx tsc --watch

Tip

Modern frameworks like Next.js, Vite, and Angular compile TypeScript for you automatically. In most projects you never run tscmanually — the dev server handles it.

The TypeScript Ecosystem

TypeScript does not live in isolation. An entire ecosystem has grown around it:

Editors and IDEs VS Code has TypeScript support built in (both are Microsoft products). WebStorm, Vim, Neovim, Emacs, and Sublime Text all have mature TypeScript plugins.

Frameworks and libraries Angular uses TypeScript by default. React, Vue, Svelte, Next.js, Nuxt, Remix, and SolidJS all have excellent TypeScript support. Express, Fastify, NestJS, and Hono support TypeScript on the server side.

Type definitions For libraries that were written in JavaScript, the community maintains type definition packages on npm under the @types scope — for example @types/node, @types/react, @types/lodash. There are over 8,000 such packages.

Tooling ts-node and tsx let you run TypeScript files directly without a separate compile step, which is useful for scripts and development. ESLint has a TypeScript plugin (@typescript-eslint) for linting TypeScript code.

Who Uses TypeScript?

TypeScript has been adopted across the industry:

Microsoft — TypeScript, VS Code, and much of the Azure SDK are written in TypeScript
Google — Angular and many Google Cloud client libraries use TypeScript
Airbnb — migrated their entire React codebase to TypeScript
Slack — rewrote their desktop application in TypeScript
Lyft — published a widely-read migration guide
Vercel — Next.js is TypeScript-first; the Vercel platform tooling is TypeScript
Stripe — their public API SDK is TypeScript
Meta — React core types and many internal tools use TypeScript

What This Tutorial Series Covers

This series takes you from zero to confident TypeScript developer. Here is the learning path:

What TypeScript is and how it compiles to JavaScript
Why TypeScript exists — the concrete problems it solves
TypeScript vs JavaScript — when to use each
Installation and project setup (tsc, tsconfig.json, VS Code)
Primitive types: string, number, boolean, null, undefined
Type annotations, type inference, and type assertions
Objects, arrays, and tuple types
Union and intersection types
Functions — parameter types, return types, overloads
Interfaces and type aliases
Generics — reusable, type-safe code
Classes with TypeScript — access modifiers, implements, abstract
Narrowing — if/typeof/instanceof and discriminated unions
Utility types — Partial, Required, Readonly, Pick, Omit, and more
Working with external libraries and .d.ts declaration files
Strict mode and advanced compiler options
TypeScript with React, Node.js, and Express

Warning

TypeScript types are erased at runtime. They cannot replace runtime validation for untrusted input (like API responses or form data). Use a library like Zod or Yup for that.

Quick Reference

TypeScript = JavaScript + a static type system
Created by Anders Hejlsberg at Microsoft, released October 2012
Every .js file is a valid .ts file — adoption is incremental
tsc compiles .ts → .js; types are erased at runtime (zero overhead)
Catches type errors at compile time, not at runtime in production
Full IDE support: autocomplete, go-to-definition, safe rename
Huge ecosystem: @types packages, framework integrations, tooling

Success

You now understand what TypeScript is, where it came from, and why the industry has adopted it. The next page dives deeper into exactly what TypeScript is under the hood — the type system, structural typing, and how .ts files become .js files.