Beginner

Hello World in TypeScript

Your first TypeScript program - the classic Hello World example with Docker setup

Every programming journey starts with Hello World. Let’s write our first TypeScript program.

The Code

Create a file named hello.ts:

1
console.log("Hello, World!");

Yes, it’s that simple! This is valid JavaScript too, but let’s see what TypeScript adds.

Understanding the Code

  • console.log() - Prints to standard output with a newline, just like JavaScript.
  • .ts extension - Tells tools this is a TypeScript file, enabling type checking.

Running with Docker

The easiest way to run this without installing Node.js locally:

1
2
3
4
5
# Pull the Node.js image
docker pull node:22-alpine

# Run with tsx (modern TypeScript executor, auto-installed via npx)
docker run --rm -v $(pwd):/app -w /app node:22-alpine sh -c "npx -y tsx hello.ts"

Running Locally

If you have Node.js installed:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
# Option 1: Use tsx (recommended - faster, no config needed)
npx tsx hello.ts

# Option 2: Install TypeScript globally
npm install -g typescript ts-node
ts-node hello.ts

# Option 3: Compile then run
tsc hello.ts      # Creates hello.js
node hello.js     # Run the JavaScript

Expected Output

Hello, World!

Key Concepts

  1. Superset of JavaScript - Any valid JS is valid TS
  2. .ts extension - Enables TypeScript tooling and type checking
  3. Compiles to JavaScript - TypeScript doesn’t run directly; it becomes JS
  4. ts-node - Convenience tool that compiles and runs in one step
  5. No runtime overhead - Types are erased at compile time

Adding Types

Let’s make it more TypeScript-like with explicit types:

1
2
const message: string = "Hello, World!";
console.log(message);

The : string is a type annotation. TypeScript can infer this type, but explicit annotations help document your code.

A Typed Function Example

1
2
3
4
5
function greet(name: string): string {
    return `Hello, ${name}!`;
}

console.log(greet("World"));

This demonstrates:

  • Parameter types - name: string ensures only strings are passed
  • Return type - : string after the parentheses declares the return type
  • Template literals - `Hello, ${name}!` for string interpolation

TypeScript vs. JavaScript Hello World

JavaScript version:

1
2
3
4
5
function greet(name) {
    return `Hello, ${name}!`;
}
console.log(greet("World"));
console.log(greet(42));  // No error, but probably a bug!

TypeScript version:

1
2
3
4
5
function greet(name: string): string {
    return `Hello, ${name}!`;
}
console.log(greet("World"));  // Works
console.log(greet(42));       // Error: Argument of type 'number' is not assignable

TypeScript catches the bug at compile time, before your code runs.

A More Complete Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
interface Person {
    name: string;
    age: number;
}

function greet(person: Person): string {
    return `Hello, ${person.name}! You are ${person.age} years old.`;
}

const user: Person = {
    name: "World",
    age: 30
};

console.log(greet(user));

This shows:

  • Interfaces - Define the shape of objects
  • Type safety - Can’t pass objects missing required properties
  • Self-documenting - The interface tells you what greet expects

Next Steps

Continue to Variables and Types to learn about TypeScript’s powerful type system.

Running Today

All examples can be run using Docker:

docker pull node:22-alpine
Last updated: