TypeScript Playground

A blank editor for experimenting with TypeScript. Write any code below — it's compiled in your browser by the real TypeScript compiler, then run, and anything you console.log appears underneath.

Try it yourself
Console output

How it works

The editor strips your type annotations using TypeScript's own compiler, then runs the resulting JavaScript in a sandboxed frame. That means it shows what your program does, but it doesn't display type errors — code with a type mistake still runs, just as it would if you ignored the compiler's warnings.

To see type errors as you type, use one of these:

  • The official TypeScript Playground at typescriptlang.org/play — shows errors, hover types and compiled output, with selectable compiler versions and settings.
  • VS Code or another editor with TypeScript support, set up as in lesson 02.

Ideas to try

  • Add a discount?: number property to Item and apply it in the total (lesson 13).
  • Write a generic sumBy<T>(items: T[], fn: (item: T) => number) helper and use it for the total (lesson 20).
  • Model an order's status as a discriminated union and print a message for each case (lesson 23).
PreviousBest Practices