Setting Up Your Workshop

The lessons on this site run TypeScript right on the page, so nothing here blocks you from continuing. But you're learning TypeScript to build real things, and real things need a real workshop: Node, the compiler, and an editor that speaks fluent TypeScript. Twenty minutes now, and every project for the rest of your career starts frictionlessly.

Node.js and npm — the platform and the package manager

Node.js runs JavaScript outside the browser; it's how TypeScript tooling executes on your machine. npm ships with it and installs packages — including TypeScript itself. Install the LTS version from nodejs.org (or via your OS package manager), then verify:

node --version   # any recent LTS is fine
npm --version

They're two different jobs worth keeping straight: Node runs code, npm fetches code. You'll type npm when adding tools to a project and node when executing something.

Installing TypeScript — project-local, on purpose

Make a folder, initialize a project, and add TypeScript as a dev dependency:

mkdir hello-ts && cd hello-ts
npm init -y
npm install -D typescript
npx tsc --version

That -D (dev dependency) and the npx prefix are deliberate. The compiler is installed inside this project — recorded in package.json, versioned with your code — and npx tsc runs that local copy.

VS Code — the editor TypeScript was built alongside

Any editor works, but Visual Studio Code and TypeScript are siblings — both Microsoft projects, developed in lockstep, and VS Code is itself written in TypeScript. Out of the box, with zero extensions, it gives you:

• Red squiggles — the checker running live as you type, same diagnostics as tsc.
• Hover types — mouse over any variable to see what the checker thinks it is. You'll use this constantly from lesson 2.1 on; it's your always-on type inspector.
• Autocomplete, go-to-definition, rename-symbol — all powered by the same type information you're learning to write.

Worth adding early: the ESLint and Prettier extensions (linting and formatting — Section 17 configures them properly). Everything else can wait.

Running TypeScript directly

tsc compiles; it doesn't run. For the tight write-run loop you'll want while learning, two good options:

# tsx: the community favorite — compile-and-run in one step, zero config
npx tsx hello.ts
 
# Recent Node (23.6+) can run .ts files directly by stripping types:
node hello.ts

Node's built-in support has one honest limitation worth knowing on day one: it strips types (erases and runs) for standard, erasable syntax — but it is not the checker. tsx and node both run your file even if the types are wrong. Type checking is tsc's job (next lesson makes that split vivid). And for zero-setup experiments away from your machine, the official TypeScript Playground is the scratchpad the whole community shares.

The loop you'll actually live in

Day to day, professional TypeScript feels like this — worth internalizing as the shape of the work:

1. Editor open — squiggles and hovers give you the checker's opinion keystroke by keystroke.
2. Run directly while iterating (npx tsx file.ts) — fast feedback on behavior.
3. npx tsc --noEmit before you commit — the full-project check, same thing CI runs.

This site's playgrounds compress that loop into one button: every Run here is a type-check followed by execution, exactly like step 3 then step 2. Next lesson you compile a real file with the real tsc and read what comes out the other side — the moment type erasure stops being a slogan.