Welcome to client-side development. Over this course we'll build Cosmos — a browser for NASA's "Astronomy Picture of the Day". And we'll build it twice: first in plain JavaScript (lessons 1–14), then migrated to strict TypeScript (15–20). That migration isn't a formality — it's the course's argument: the TypeScript compiler will find real bugs in the working vanilla code.

Where we're going (the finished app). Cosmos will have: a landing page with stats, a gallery with search and a date filter, a collection (a table with sorting, pagination and favorites), a single-picture detail view (shareable by link), settings and contact forms with validation, modals, toasts, keyboard shortcuts and a theme toggle. All of it — with no framework (no Vue, no React). That's deliberate: you understand the platform first.

Where the look comes from. You built the page's styling — style.css — by hand in the HTML and CSS foundations track. Here you are handed its complete version, which also carries the rules a static page never needed: modals, toasts, the collection table. You do not edit it again. This track rebuilds the same page in JavaScript on top of what is already laid down.

The key idea of this lesson: JavaScript needs no build step. So many courses open with npm create vite, and students conclude that tooling is mandatory. It isn't. The browser is the runtime: you write HTML, CSS and JS, open it in a browser — and it runs. No Node, no npm, no bundler.

So when does tooling appear? In lesson 15 — with TypeScript, and only because TypeScript can't run in a browser: it must be compiled to JavaScript. The tool arrives when it's genuinely needed — not before. "Feel the pain, earn the tool."

In this lesson we build the smallest working Cosmos: an HTML page that loads CSS and one JavaScript module. And we hit the platform's first constraint — why opening the file directly (double-clicking it) fails, while a server works.