Skip to main content

Getting Started

Welcome to the TypeScript series! 👋

If you've gone through the JavaScript section of this site, you already know how much I love JavaScript. I've built my career on it — frontend, backend with Node.js, and mobile with React Native. But after years of shipping production code, I can tell you honestly: on any project bigger than a weekend script, I reach for TypeScript.

What is TypeScript?​

TypeScript is JavaScript with a type system on top. It was created by Microsoft in 2012 and today it powers most serious JavaScript codebases — VS Code, Slack, Airbnb, and pretty much every large Node.js or React project I've worked on professionally.

Three things to understand up front:

  • Every valid JavaScript file is already valid TypeScript. You can rename app.js to app.ts and it works. You add types gradually.
  • TypeScript compiles down to plain JavaScript. Browsers and Node.js never see your types — they run normal JS.
  • All the checking happens before your code runs. That's the whole point: catch bugs at compile time, not at 2 AM in production.

Why Does TypeScript Exist?​

JavaScript is dynamically typed. That flexibility is great for small scripts, but it also means JavaScript will happily run code that is obviously broken. Here's a real bug pattern I've seen (and written) more than once:

// user-service.js — plain JavaScript
function getFullName(user) {
  return user.firstName + " " + user.lastName;
}

const user = { first_name: "Rizwan", last_name: "Ashiq" };

console.log(getFullName(user)); // "undefined undefined"

No error. No warning. JavaScript runs this happily and prints "undefined undefined" because the property names don't match (firstName vs first_name). You only find out when a user reports that their profile page says "undefined undefined". Ask me how I know. 😅

Now the same code in TypeScript:

// user-service.ts — TypeScript
interface User {
  firstName: string;
  lastName: string;
}

function getFullName(user: User): string {
  return user.firstName + " " + user.lastName;
}

const user = { first_name: "Rizwan", last_name: "Ashiq" };

console.log(getFullName(user));
// ❌ Compile error: Argument of type '{ first_name: string; last_name: string; }'
//    is not assignable to parameter of type 'User'.

The bug never makes it out of your editor. Your IDE underlines it in red the moment you type it. That's the trade TypeScript offers: a little more typing (pun intended) in exchange for a whole category of bugs disappearing.

What TypeScript Gives You​

  • 🐛 Fewer runtime bugs — typos, wrong arguments, and missing properties are caught while you type
  • 🧠 Better autocomplete — your editor knows exactly what properties and methods exist
  • 📖 Self-documenting code — a function signature tells you what it accepts and returns
  • 🔧 Fearless refactoring — rename a property and the compiler shows you every place that breaks
  • 👥 Easier teamwork — types are a contract between you and the next developer

How TypeScript Runs​

TypeScript itself never runs anywhere. The compiler (tsc) type-checks your code and strips the types out, producing plain JavaScript that runs like any other JS:

If the type check fails, you fix the error before shipping. If it passes, the output is normal JavaScript — no types, no overhead, no runtime cost.

What This Series Covers​

🟢 Basics​

  • Setup — installing TypeScript, understanding tsconfig.json, compiling and running
  • Basic Types — annotations, inference, unions, literal types, and narrowing
  • Objects and Interfaces — shaping your data with interfaces and type aliases
  • Functions and Generics — typed functions and reusable generic code
  • TypeScript in Practice — strict mode, Express, React, and the @types ecosystem

Each doc is code-heavy and practical. I'll show you the patterns I actually use in production MERN projects, not academic type gymnastics.

Prerequisites​

You should be comfortable with JavaScript fundamentals: variables, data types, functions, objects, and arrays. If you're not there yet, go through the Basics of JavaScript section on this site first — this series builds directly on it.

You'll also need:

  • Node.js installed (version 18 or newer)
  • A code editor — I strongly recommend VS Code, which has TypeScript support built in
TypeScript is not a different language

Don't think of TypeScript as something new to learn from scratch. It's the JavaScript you already know, plus a layer of type annotations. Everything you learned in the JS series — closures, promises, array methods — works exactly the same.

A common worry

"Won't types slow me down?" — In my experience, the opposite. You spend a few extra seconds writing a type, and save the twenty minutes you would have spent debugging undefined is not a function. The bigger the project, the bigger the payoff.

Ready? Let's set up your first TypeScript project. 🚀

Last updated on