In the previous tutorial, we learned what TypeScript is and why it matters. Now let’s install it and write our first program.

By the end of this tutorial, you will have TypeScript installed, VS Code configured, and a working project you built yourself.

Step 1: Install Node.js

TypeScript runs on Node.js. If you don’t have Node.js installed, download the LTS version from nodejs.org.

After installation, verify it works:

node --version
# v22.x.x or later

npm --version
# 10.x.x or later

If both commands print version numbers, you are ready.

Step 2: Install TypeScript

There are two ways to install TypeScript: globally or per project. We will do both.

Global Installation

Install TypeScript globally so you can use the tsc command anywhere:

npm install -g typescript

Verify it works:

tsc --version
# Version 6.0.x

For real projects, install TypeScript as a dev dependency. This way, every developer on the team uses the same version.

Create a new project folder:

mkdir typescript-tutorial
cd typescript-tutorial
npm init -y
npm install typescript --save-dev

Now TypeScript is listed in your package.json under devDependencies.

Step 3: Set Up VS Code

VS Code has built-in TypeScript support. No extension needed for basic features. But these extensions make the experience much better:

ExtensionWhat It Does
Error LensShows errors inline, right next to the code
ESLintCatches code style issues and common mistakes
PrettierFormats your code automatically on save

Install them from the VS Code Extensions panel (Ctrl+Shift+X or Cmd+Shift+X).

Open VS Code settings (Ctrl+, or Cmd+,) and enable these:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "typescript.preferences.importModuleSpecifier": "relative"
}

This formats your code on save and uses relative imports by default.

Step 4: Configure tsconfig.json

Every TypeScript project needs a tsconfig.json file. This tells the compiler how to process your code.

Generate one with:

npx tsc --init

This creates a tsconfig.json with many commented options. Here is a clean version for learning:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "strict": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"]
}

Let’s understand the important options:

OptionWhat It Does
targetWhich JavaScript version to output. ES2022 works everywhere modern.
moduleModule system. NodeNext is the modern choice for Node.js projects.
strictEnables all strict type checking. Always keep this on.
outDirWhere compiled JavaScript files go.
rootDirWhere your TypeScript source files live.
esModuleInteropMakes imports from CommonJS modules work smoothly.
skipLibCheckSkips type checking of .d.ts files. Speeds up compilation.

The most important option is strict: true. This enables strict null checks, strict function types, and other checks that catch real bugs. Never turn it off.

Step 5: Write Your First Program

Create the source directory and a file:

mkdir src

Create src/main.ts with this content:

const greeting: string = "Hello, TypeScript!";
console.log(greeting);

function add(a: number, b: number): number {
  return a + b;
}

const result = add(5, 3);
console.log(`5 + 3 = ${result}`);

This is a simple program with type annotations. The : string after greeting tells TypeScript this variable must be a string. The : number annotations tell TypeScript the function takes numbers and returns a number.

Step 6: Compile and Run

Option A: Compile Then Run

Compile your TypeScript to JavaScript:

npx tsc

This creates dist/main.js. Run it with Node.js:

node dist/main.js

Output:

Hello, TypeScript!
5 + 3 = 8

Look at the generated dist/main.js:

"use strict";
const greeting = "Hello, TypeScript!";
console.log(greeting);
function add(a, b) {
    return a + b;
}
const result = add(5, 3);
console.log(`5 + 3 = ${result}`);

Notice: all type annotations are gone. The output is plain JavaScript. Types exist only during development.

Node.js 22.6+ supports TypeScript natively. It strips the types and runs the code directly. No extra tools needed:

node src/main.ts

Output:

Hello, TypeScript!
5 + 3 = 8

This is the simplest way to run TypeScript during development. On Node.js 22.18+, type stripping is enabled by default — no flag needed. On older versions (22.6–22.17), add --experimental-strip-types. On versions before 22.6, use tsx instead (Option C below).

Option C: Run Directly with tsx

If you need extra features like watch mode or path aliases, use tsx:

npm install -D tsx
npx tsx src/main.ts

tsx compiles and runs in one step. It works on any Node.js version and supports features that Node.js native execution does not yet handle (like enum declarations and import = syntax).

Try TypeScript Online

If you don’t want to install anything yet, use the TypeScript Playground: typescriptlang.org/play

You can write TypeScript in the browser, see the compiled JavaScript output, and check for errors. It is great for experimenting.

Your Project Structure

After this tutorial, your project looks like this:

typescript-tutorial/
  package.json
  tsconfig.json
  src/
    main.ts
  dist/
    main.js
  node_modules/
  • src/ — your TypeScript source files
  • dist/ — compiled JavaScript output (generated by tsc)
  • tsconfig.json — TypeScript configuration

Add Useful Scripts

Add these scripts to your package.json:

{
  "scripts": {
    "build": "tsc",
    "start": "node src/main.ts",
    "dev": "tsx --watch src/main.ts",
    "check": "tsc --noEmit"
  }
}

Now you can run:

  • npm run build — compile TypeScript to JavaScript
  • npm run start — run your code directly with Node.js
  • npm run dev — run with auto-reload on file changes (requires tsx)
  • npm run check — type-check without producing output files

The check script is especially useful. It validates your types without creating any files.

Common Errors and Fixes

“Cannot find module” Error

If you see this error, check that your tsconfig.json has the correct module and moduleResolution settings. For Node.js projects, use NodeNext for both.

“Parameter implicitly has an ‘any’ type”

This means you forgot to add a type annotation. With strict: true, TypeScript requires types for function parameters:

// Error: Parameter 'name' implicitly has an 'any' type
function greet(name) {
  return "Hello, " + name;
}

// Fixed: add the type annotation
function greet(name: string) {
  return "Hello, " + name;
}

“Type ‘string’ is not assignable to type ’number’”

TypeScript caught a type mismatch. This is TypeScript doing its job. Read the error message — it tells you exactly what went wrong and where.

What is Next?

In the next tutorial, we will learn all the basic types in TypeScript: strings, numbers, booleans, arrays, tuples, and more. You will understand how the type system works and when to use each type.