Orientation: why this chapter delivers TypeScript, not just modern JS
Artifact: A clear map of the chapter and a preview of the assignment before you start
1. The promise
You'll know what the next sixteen units cover, why TypeScript sits at the centre of this chapter instead of as a bolt-on, and what the chapter assignment looks like before you write a single line.
2. The mental model
Ch 6 taught you the words of JavaScript. This chapter teaches you the grammar that lets a machine check those words before they ship. You're moving from a language you speak to a language you spell-check.
In 2026, the codebases you'll join are TypeScript codebases. Knowing JavaScript without TypeScript is like knowing English without spelling — fine for talking, not fine for writing pull requests.
(DIAGRAM: the chapter map — node tree — three branches from "Modern JS and TS": Foundations (9.1 through 9.8), Composition (9.9 through 9.13), Modern ES plus Practice (9.14 through 9.15), with the assignment hanging off the right)
The chapter at a glance:
- 9.1 — why TypeScript exists at all, with five bugs JavaScript silently lets through.
- 9.2 — installing TypeScript and writing a
tsconfig.jsonfrom scratch. - 9.3 — the single most important fact about types: they're descriptions, not enforcement.
- 9.4 to 9.8 — the basic type kit: primitives, objects, arrays, functions, unions, intersections.
- 9.9 — narrowing a wide type to a specific one.
- 9.10 — choosing between
interfaceandtypewithout dogma. - 9.11 — the three edge-case types:
unknown,any, andnever. - 9.12 — generics, gently. Three worked examples.
- 9.13 — the five utility types you'll reach for every week.
- 9.14 — modern ES features worth using daily.
- 9.15 — type-driven development in practice.
What this chapter is not: a deep tour of decorators, conditional types, mapped types beyond the utility-type set, or the compiler API. Those land in later chapters when the situation needs them.
(SCREENSHOT: VSCode with an empty TypeScript file index.ts open — full window — the .ts extension highlighted in the tab)
The assignment preview. You'll take the to-do app you built in Ch 7 and convert it to strict TypeScript. The acceptance criteria are simple to state and not simple to hit:
- Zero
any. - Zero
@ts-ignore. npx tsc --noEmitpasses clean.
The work lives on a feature branch, gets pushed to GitHub, and gets self-reviewed as a PR before you merge it. Ch 8 prepared you for that part.
(SCREENSHOT: VSCode tooltip on a JS variable showing the inferred type string — full window — the tooltip popover highlighted)
One line on AI tools. The editor's red squiggles are themselves a kind of AI feedback. Read the squiggle before you ask anyone, human or model, for help. You'll learn how to wield Claude Code in Ch 22 and Ch 23. Until then, the editor is the only assistant you need.
3. You do it, with me
There's nothing to install in this unit. Read along.
Open this chapter's index in your browser and skim the unit titles. Notice the shape: a problem (9.1), a setup (9.2), a mental model (9.3), a tour of the type kit (9.4 to 9.8), the hard bit (9.9), the pragmatic bits (9.10 to 9.14), and the integration (9.15). The assignment sits at the bottom and tests every piece at once.
Then open the Ch 7 to-do folder on your machine. You'll see index.html, a CSS file, and one or two .js files. By the end of this chapter, each .js file is a .ts file, and the editor catches mistakes the JavaScript version did not.
4. What you should be seeing
Three pictures in your head:
- One unit. Six beats, same as every chapter.
- One chapter. Sixteen short units, then one assignment that gates Ch 10.
- The assignment. Your Ch 7 to-do app, retyped, strict, green.
If you can list those three things without scrolling back, you're done with this unit.
5. Common stumbles
- You expect TypeScript to make the code run differently. It doesn't. The output JavaScript looks almost identical to what you wrote. TypeScript is a check, not a transform. Unit 9.3 makes this concrete.
- You expect the assignment to be "build something new". It isn't. It's "convert what you have." Conversions are most of what you'll do in the first year of your career; this one teaches you how.
- You skim ahead to 9.12 because generics look scary. Don't. Generics make sense after you've used unions, narrowing, and
interfacevstype. Read the chapter in order.