What is TypeScript?

Welcome to TypeScript

TypeScript is a statically-typed superset of JavaScript developed and maintained by Microsoft. Every valid JavaScript programme is also valid TypeScript, which means you can adopt TypeScript gradually without rewriting your existing codebase. TypeScript adds an optional type system on top of JavaScript and that type system is erased entirely when the code is compiled down to plain JavaScript. The browser or Node.js runtime never sees your type annotations; they exist solely to help you and your tools catch mistakes early.

Why Static Typing Matters

In plain JavaScript, you discover many errors only when you run the programme. A misspelled property name, a function called with the wrong number of arguments or a variable that unexpectedly holds undefined can all slip through unnoticed until a user encounters a crash. TypeScript shifts those discoveries to compile time. The compiler analyses your code before it runs and flags inconsistencies, giving you a safety net that grows more valuable as your project scales.

Static typing also transforms your editor into an intelligent assistant. Autocompletion becomes precise because the editor knows exactly which properties exist on an object. Refactoring a function signature triggers warnings everywhere the function is called, so you can rename or restructure code with confidence.

How Compilation Works

TypeScript files use the .ts extension (or .tsx for files containing JSX). The TypeScript compiler, tsc, reads these files and produces standard JavaScript. You control the output target through a configuration file called tsconfig.json, which sits at the root of your project. Here is a minimal example:

```typescript
// tsconfig.json
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "strict": true,
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": ["src/**/*"]
}
```

The target option tells the compiler which version of JavaScript to emit. Setting "strict": true enables a collection of stricter checks that catch more potential issues. The outDir and rootDir options control where compiled files are written and where source files are found.

TypeScript vs JavaScript: A Practical Comparison

```typescript
// JavaScript: no type checking
function calculateTotal(items) {
  return items.reduce((sum, item) => sum + item.price, 0);
}
calculateTotal("not an array"); // runtime crash
// TypeScript: the compiler catches the mistake
interface CartItem {
name: string;
price: number;
quantity: number;
}
function calculateTotal(items: CartItem[]): number {
return items.reduce((sum, item) => sum + item.price * item.quantity, 0);
}
calculateTotal("not an array"); // Compile error: Argument of type 'string'
// is not assignable to parameter of type 'CartItem[]'
<p>Notice how the TypeScript version communicates intent. Anyone reading the function signature immediately understands what data it expects and what it returns, without digging into the implementation.</p>

<h3>When to Use TypeScript</h3>
<p>TypeScript excels in medium-to-large projects where multiple developers collaborate and where the codebase is expected to grow over time. It is also a strong choice for libraries and APIs, because the type definitions serve as self-updating documentation. For a quick prototype or a tiny script, plain JavaScript may be faster to set up. However, many developers find that even in small projects the autocomplete and error-checking benefits justify the minimal overhead.</p>

<h3>Industry Adoption</h3>
<p>TypeScript has seen rapid growth across the global developer community. Angular is built entirely in TypeScript. Vue 3 was rewritten in TypeScript. The React ecosystem offers first-class TypeScript support and popular frameworks like Next.js and NestJS are TypeScript-first. Major organisations including Slack, Airbnb and Shopify have adopted TypeScript for their production systems.</p>

<h3>The South African Job Market</h3>
<p>In South Africa, TypeScript skills are increasingly sought after. Job listings on platforms like OfferZen and LinkedIn regularly list TypeScript alongside React or Angular as a requirement. Companies in Johannesburg, Cape Town and Durban are building modern web applications and expect developers to be comfortable with typed JavaScript. Adding TypeScript to your skill set makes you more competitive whether you are applying for local positions or remote roles with international teams.</p>

<h3>Key Features at a Glance</h3>
<ul>
  <li><strong>Static typing with type inference:</strong> you annotate types where it helps and the compiler infers the rest</li>
  <li><strong>Interfaces and type aliases:</strong> describe the shape of your data clearly</li>
  <li><strong>Generics:</strong> write reusable, type-safe functions and classes</li>
  <li><strong>Union and intersection types:</strong> model complex data relationships</li>
  <li><strong>Excellent tooling:</strong> VS Code, WebStorm and other editors provide deep TypeScript integration</li>
  <li><strong>Gradual adoption:</strong> start with a single file and expand at your own pace</li>
</ul>

<p>In the lessons that follow, you will learn the TypeScript type system from the ground up, starting with basic types and building toward advanced patterns used in production applications.</p>