TypeScript for JavaScript Developers

TypeScript is JavaScript with a compile-time type system — the language you already know, plus a checker that catches bug categories before they ship. This track starts from your existing JavaScript fluency: every lesson explains why the type system exists, shows the plain-JS failure pattern it prevents, and teaches the production practices that make types pay off in real codebases. You keep the entire JavaScript ecosystem; you gain refactor safety, self-documenting APIs, and a CI gate for correctness.

How to study this track: lessons build in order — the compiler model from phase 1 is assumed everywhere else. Each example states its purpose, the output you should see, and the takeaway; run the demos locally as you go.

TypeScript Study Progress

0% Complete
# TypeScript Topic Description
PHASE 1: WHY TYPESCRIPT & FOUNDATIONS
01Why TypeScript for JavaScript DevelopersThe runtime-bug patterns types eliminate, what TypeScript changes and what it deliberately does not.
02Setup and the Strict ToolchainInstall tsc as a project tool, a strict tsconfig baseline, and the three ways to run TypeScript.
03Inside the CompilerChecking versus emitting, type erasure, and disciplined error suppression.
04The Syntax DeltaAnnotation syntax and the type-level constructs layered onto JavaScript you already know.
PHASE 2: THE TYPE SYSTEM
05Core Types and NarrowingPrimitives, any versus unknown, unions, discriminated unions, and control-flow narrowing.
06Structural TypingWhy shapes, not names, decide compatibility — and when that backfires.
07Typed FunctionsSignatures, overloads, contextual typing, and safe callbacks.
08Interfaces and ContractsOptional and readonly members, interface versus type alias, declaration merging.
09Classes and InvariantsAccess modifiers, strict initialization, and composition over inheritance.
10Generics and InferenceType parameters, constraints, and designing for inference first.
PHASE 3: ADVANCED TYPE PROGRAMMING
11Mapped and Conditional TypesComputing new types from existing ones: key remapping, infer, template literals.
12Declaration Files and AugmentationReading and writing .d.ts, @types packages, safe module augmentation.
13Modules and ImportsESM versus CommonJS, verbatimModuleSyntax, resolution and barrel files.
14Decorators and MetadataStage 3 versus legacy decorators, metadata patterns, when the trade-off pays.
PHASE 4: PRODUCTION
15Errors and Runtime Validationunknown catches, result types, and validating untrusted data with zod.
16Testing TypeScriptWhat types prove versus what tests prove; typing Vitest suites and mocks.
17Linting, Formatting, CItypescript-eslint, project references, and the incremental CI pipeline.
18Run and DebugSource maps, launch configs, and debugging compiled output.
19Migrating JavaScript to TypeScriptThe strangler-fig path: allowJs, JSDoc checking, gradual strictness.
20Framework IntegrationReact, Node APIs, and library authoring with typed boundaries.
21Architecture at ScaleType layers, project references, and keeping the checker fast in monorepos.
PHASE 5: PRACTICE & DEMO
22Demo Examples LabRunnable single-file TypeScript demos with source and live preview.
23Study ProjectsProgressive projects that apply every phase of the track.
24Open-Source LabTypeScript repositories on GitHub worth studying, with what to read in each.
PHASE 6: REFERENCE
25References and StandardsOfficial documentation, free books and courses, tooling references.

Free TypeScript Resources

ResourceWhat it is
typescriptlang.org/docsThe official handbook and reference — the primary source this track cites.
TypeScript PlaygroundRun and share TypeScript in the browser; test every example without installing anything.
Total TypeScript TutorialsMatt Pocock's free tutorials, from beginner exercises to type-level wizardry.
typescript-eslintThe official linting layer for TypeScript-specific rules.
TSConfig ReferenceEvery compiler option, explained by the team that built them.
TypeScript Tooling cheatsheetsCommunity-maintained cheatsheets for real-world setups.