TypeScript Introduction and Setup

beginner
10 min

TypeScript Introduction and Setup

TypeScript is a strongly typed superset of JavaScript developed by Microsoft. Every valid JavaScript program is also valid TypeScript, but TypeScript adds a powerful static type system on top. Types are checked at compile time, which means entire categories of bugs — misspelled property names, wrong argument types, forgotten null checks — are caught before your code ever runs in a browser or on a server.

In this first lesson you will learn what TypeScript is, why teams adopt it, how to install the compiler, and how to write and run your very first TypeScript program.

Why Use TypeScript?

JavaScript is dynamically typed: a variable can hold a number one moment and a string the next. That flexibility is convenient in small scripts but becomes a liability in large codebases. TypeScript addresses this with several concrete benefits:

  • Early error detection. The compiler flags type mismatches, typos, and missing properties before runtime.
  • Better tooling. Editors like VS Code use type information to power autocompletion, inline documentation, and safe refactoring.
  • Self-documenting code. Function signatures describe exactly what they accept and return, so new team members understand code faster.
  • Gradual adoption. You can rename a .js file to .ts and add types incrementally — nothing forces a rewrite.

Importantly, TypeScript compiles down to plain JavaScript, so it runs anywhere JavaScript runs: browsers, Node.js, Deno, and serverless platforms.

Installing TypeScript

You need Node.js installed first (any recent LTS version works). Then install the TypeScript compiler globally or as a project dependency:

bash
# Global install npm install -g typescript # Or, recommended: per-project install npm init -y npm install --save-dev typescript # Verify the version npx tsc --version

The command tsc is the TypeScript compiler. Installing per-project keeps every teammate on the same compiler version, which avoids subtle differences in type-checking behavior.

Your First TypeScript Program

Create a file named greet.ts:

typescript
function greet(name: string): string { return "Hello, " + name + "! Welcome to TypeScript."; } const user: string = "Ada"; console.log(greet(user));

The : string after name is a type annotation. It tells the compiler that greet only accepts strings. If you try greet(42), compilation fails with a clear error message instead of producing a confusing runtime bug.

Compile and run it:

bash
npx tsc greet.ts # produces greet.js node greet.js # prints the greeting

Faster Feedback with ts-node and Watch Mode

Compiling manually on every change gets tedious. Two popular options speed things up:

bash
# Run TypeScript directly without a separate compile step npm install --save-dev ts-node npx ts-node greet.ts # Or have tsc recompile automatically on save npx tsc greet.ts --watch

Modern runtimes are converging on this workflow too — recent versions of Node.js can strip types and execute .ts files directly, and tools like tsx and Vite make the edit-run loop nearly instant.

Initializing a Project

Real projects use a tsconfig.json file to configure the compiler once instead of passing flags every time:

bash
npx tsc --init

This generates a config file with sensible defaults and helpful comments. We will explore the most important options — strict, target, outDir, and more — in a dedicated lesson later in this series.

Key Takeaways

  • TypeScript is JavaScript plus a static type system; it compiles to plain JavaScript.
  • Types catch bugs at compile time and unlock excellent editor tooling.
  • Install with npm install --save-dev typescript and compile with npx tsc.
  • Use ts-node, tsx, or watch mode for a fast development loop.
  • npx tsc --init scaffolds a project configuration file.

Next lesson: Basic Types — learn string, number, boolean, any, and unknown, the building blocks of every TypeScript program.