HOME / CATALOG / TYPESCRIPT
01
ROADMAP / INTERMEDIATE

TypeScript

28 TOPICS · 20 HOURS · INTERMEDIATE · SCALE 1:4
START CANVAS

Master TypeScript from basic type annotations to advanced type-level programming. This roadmap takes you from JavaScript fundamentals through the type system, generics, and real-world patterns used in production codebases.


§ SYLLABUS

§ SECTION 01 · FOUNDATIONS
  1. 01
    TypeScript Setup & Tooling

    Install TypeScript, configure tsconfig.json, and understand the compilation pipeline from .ts files to JavaScript output.

  2. 02
    Primitive Types & Type Annotations

    Learn to annotate variables, parameters, and return values with string, number, boolean, null, undefined, and symbol.

  3. 03
    Arrays & Tuples

    Understand typed arrays, readonly arrays, and fixed-length tuple types for structured data.

  4. 04
    Objects & Interfaces

    Define object shapes using interfaces and type aliases, including optional and readonly properties.

§ SECTION 02 · THE TYPE SYSTEM
  1. 01
    Union & Intersection Types

    Combine types with | and & to model values that can be one of several shapes or must satisfy multiple contracts.

  2. 02
    Type Narrowing & Guards

    Use typeof, instanceof, in, and custom type predicates to refine types within conditional branches.

  3. 03
    Literal Types & Enums

    Restrict values to specific strings, numbers, or named constants using literal types and enum declarations.

  4. 04
    Type Aliases vs Interfaces

    Understand the practical differences between type and interface, including declaration merging and extension patterns.

§ SECTION 03 · FUNCTIONS & CALLABLE TYPES
  1. 01
    Function Type Signatures

    Type function parameters, return values, optional/default parameters, rest parameters, and callback signatures.

  2. 02
    Function Overloads

    Define multiple call signatures for a single function to handle different argument combinations with precise return types.

  3. 03
    Introduction to Generics

    Write reusable functions and data structures that work across types while preserving type information through type parameters.

  4. 04
    Generic Constraints & Defaults

    Restrict generic type parameters with extends clauses and provide sensible defaults for cleaner call-site ergonomics.

§ SECTION 04 · CLASSES & OBJECT-ORIENTED PATTERNS
  1. 01
    Classes & Access Modifiers

    Use public, private, protected, and readonly modifiers to control visibility and mutability of class members.

  2. 02
    Abstract Classes & Implements

    Define contracts with abstract classes and the implements keyword to enforce structure across class hierarchies.

  3. 03
    Generic Classes & Interfaces

    Apply generics to classes and interfaces to build type-safe containers, repositories, and service patterns.

§ SECTION 05 · ADVANCED TYPE-LEVEL PROGRAMMING
  1. 01
    Mapped Types

    Transform existing types by iterating over their keys to create new types like Partial, Required, and Readonly.

  2. 02
    Conditional Types

    Write types that branch based on assignability using the extends ? : pattern to create flexible, context-dependent types.

  3. 03
    Built-in Utility Types

    Master Pick, Omit, Record, Exclude, Extract, ReturnType, Parameters, and other built-in type transformations.

  4. 04
    Template Literal Types

    Construct string types from unions and patterns to create type-safe route strings, event names, and CSS properties.

  5. 05
    The infer Keyword

    Extract type components from complex types inside conditional type branches to deconstruct and reshape types.

§ SECTION 06 · MODULES, DECLARATIONS & CONFIGURATION
  1. 01
    ES Modules & Import Types

    Understand module resolution, import/export syntax, type-only imports, and the difference between ESM and CommonJS in TypeScript.

  2. 02
    Declaration Files & DefinitelyTyped

    Write and consume .d.ts files to add types for untyped JavaScript libraries and understand the @types ecosystem.

  3. 03
    tsconfig.json Deep Dive

    Configure strict mode, module resolution, path aliases, project references, and compiler options for different environments.

§ SECTION 07 · REAL-WORLD TYPESCRIPT PATTERNS
  1. 01
    Discriminated Unions & State Machines

    Model complex application states and API responses as tagged unions with exhaustive switch handling.

  2. 02
    Type-Safe Error Handling

    Use Result types, branded types, and discriminated unions to make errors part of the type system instead of relying on try-catch.

  3. 03
    Typing Async Code

    Type promises, async functions, generators, and async iterators to keep asynchronous code fully type-safe.

  4. 04
    TypeScript with React

    Type components, props, hooks, context, refs, and event handlers in React applications using idiomatic patterns.

  5. 05
    End-to-End Type Safety

    Share types across API boundaries using tools like Zod, tRPC, or OpenAPI to eliminate type mismatches between client and server.