Theory

One feature through both builds

To make the arc "click", trace one feature through both builds — you'll see exactly what the types added.

Take the picture detail (detail) you built in lesson 14.

The vanilla version worked — but with hidden traps:

img.src = pic.hdurl || pic.url;              // works ONLY because you remembered "|| pic.url"
if (pic.copyright) {                          // works ONLY because you remembered this if
  credit.textContent = ${pic.copyright}`;
}

Both lines are correct — but nothing enforced that you'd write them. A new teammate copying code could easily drop the || pic.url or the if — and the app would crash on a video day, or on a picture with no owner.

The TypeScript version makes those bugs unwritable:

if (pic.media_type === 'image') {
  img.src = pic.hdurl ?? pic.url;            // hdurl is reachable ONLY after the media_type check
}
if (pic.copyright !== undefined) {           // the compiler REQUIRES this check
  credit.textContent = ${pic.copyright}`;
}

The difference isn't style — it's what enforces correctness. Vanilla: your memory and discipline. TypeScript: a compiler that refuses to compile until you handle every case. Forgetting becomes impossible — not because you got more careful, but because the language no longer allows it.

The same shows up everywhere:

Place Vanilla TypeScript
media_type "remember the check" narrowing required
state isLoading + error separate LoadStatus union (can't have both)
API response trusts any a type guard at the boundary
sorting switch with no default assertNever — all variants
rating any number Rating = 0..5

On every line, TypeScript turned "you have to remember" into "you can't forget". That IS the course — not "TypeScript is good", but "here's exactly which of your own bugs it catches, and why vanilla didn't".