Skip to main content

⚡ JavaScript & the browser

JavaScript as the browser's runtime — for Python devs shipping their own UIs

JavaScript track — phase 1 COMPLETE. All 9 modules ship with 90 lessons total. C1 covers the language itself. C2 wires JavaScript to the DOM. C3 is modules & bundling. C4 (async & fetch) covers Promises, async/await, fetch GET / POST, the network-error vs HTTP-error distinction, AbortController, Promise.all / race / allSettled, for-await-of, top-level await, and a search-box capstone with debounce + abort. C5 (types without TypeScript) — typeof / instanceof narrowing, Array.isArray, JSDoc @param + @typedef, discriminated unions, optional chaining ?. / nullish coalescing ??, when to NOT add types, and a capstone refactor. C6 (iterators & generators) — for-of vs forEach, Maps & Sets, Symbol.iterator, function* + yield, lazy infinite sequences, yield* delegation, async generators, paginated fetch streaming, spread/destructuring, and a streaming CSV parser. C7 (errors & debugging) — throw/catch, the Error object, custom Error classes, try/catch/finally, instanceof narrowing, async error flow, error chaining with cause, the console.* methods beyond .log(), defensive parsing, and a typed-error fetch wrapper capstone. C8 (testing without a framework) — assertion helpers, deep equality, roll-your-own test runner, Arrange-Act-Assert, describe nesting, spies, async tests, beforeEach/afterEach, helpful failure output, and a capstone testing a sorted set. C9 (browser platform APIs) — localStorage, JSON-in-storage with versioning, sessionStorage, URL + URLSearchParams, structuredClone, requestAnimationFrame, AbortController as a cancellation token, EventTarget for custom event buses, View Transitions, and a capstone undo stack with persistence.

90
lessons
9
modules
12
free
▶ Start lesson 1

First 12 lessons free, no card required. The rest unlock with a 7-day Pro trial.

1

Module 01JavaScript & the platform

10 lessons

console.log to event handlers — the bare minimum to read other people's JS without panic. Variables, types, control flow, the gotchas modern stacks still trip on.

  1. 1.console.log: your first line of JavaScript5m · 50xpFREE
  2. 2.let and const: never use var6m · 75xpFREE
  3. 3.Template literals: strings that breathe5m · 50xpFREE
  4. 4.Arrays: push, map, filter — the three you use daily8m · 100xpFREE
  5. 5.Build a Counter with JavaScript and addEventListener12m · 200xpFREE
  6. 6.Objects: properties, methods, destructuring7m · 75xpFREE
  7. 7.Functions: arrow vs declaration, and when each one wins8m · 75xpFREE
  8. 8.Conditionals + the falsy gotcha7m · 75xpFREE
  9. 9.Loops: for-of, forEach, and when to use which7m · 75xpFREE
  10. 10.Build a Live Word Counter in Vanilla JavaScript14m · 250xpFREE
2

Module 02DOM & events

10 lessons

Query, listen, modify. The browser as a tree your code edits live.

  1. 1.getElementById + textContent: the cheapest DOM update6m · 75xpFREE
  2. 2.querySelector + querySelectorAll: CSS selectors in JS6m · 75xp🔒
  3. 3.addEventListener: click and the event object7m · 75xp🔒
  4. 4.classList: toggle classes the modern way6m · 75xp🔒
  5. 5.Reading form inputs without a framework8m · 100xp🔒
  6. 6.Form submit + preventDefault: stop the page reload8m · 100xp🔒
  7. 7.Creating elements: createElement vs innerHTML8m · 100xp🔒
  8. 8.Event delegation: one listener for a thousand items8m · 100xp🔒
  9. 9.Keyboard events: keydown, modifiers, and the Escape key8m · 100xp🔒
  10. 10.Build a Todo List in Vanilla JavaScript with Event Delegation14m · 250xp🔒
3

Module 03Modules & bundling

10 lessons

import / export, bare specifiers, why Vite vs Webpack vs nothing.

  1. 1.<script type='module'>: ES modules in the browser6m · 75xp🔒
  2. 2.Named exports: importing several things6m · 75xp🔒
  3. 3.Default export vs named: when each one fits7m · 75xp🔒
  4. 4.Dynamic import(): load code on demand8m · 100xp🔒
  5. 5.Tree-shaking: why named imports beat namespace imports7m · 75xp🔒
  6. 6.Import maps: bare specifiers without a bundler8m · 100xp🔒
  7. 7.package.json: the 6 fields you actually need7m · 75xp🔒
  8. 8.Bundlers in 2026: Vite, esbuild, or nothing8m · 75xp🔒
  9. 9.Semver: ^1.2.3, ~1.2.3, and when each matters7m · 75xp🔒
  10. 10.Build a Small JavaScript Library with ES Module Exports12m · 250xp🔒
4

Module 04Async & fetch

10 lessons

Promises, async/await, fetch, the AbortController contract.

  1. 1.Promises: a value that's not here yet7m · 75xp🔒
  2. 2.JavaScript async / await Tutorial: Promise chains, simplified7m · 100xp🔒
  3. 3.JavaScript fetch() Tutorial: GET requests + the r.ok trap8m · 100xp🔒
  4. 4.POSTing JSON: method + headers + body8m · 100xp🔒
  5. 5.Error handling: network errors vs HTTP errors vs body errors9m · 100xp🔒
  6. 6.AbortController in JavaScript: Cancel a Fetch Request8m · 100xp🔒
  7. 7.Promise.all + Promise.race + Promise.allSettled8m · 100xp🔒
  8. 8.for-await-of in JavaScript: Iterate Over Async Sources8m · 100xp🔒
  9. 9.Top-Level await in ES Modules: Skip the IIFE Wrapper6m · 75xp🔒
  10. 10.Build a Live Search Box with Fetch, Debounce and AbortController14m · 250xp🔒
5

Module 05Types without TypeScript

10 lessons

JSDoc, type narrowing, when to NOT reach for TS.

  1. 1.typeof — the runtime type guard6m · 75xpFREE
  2. 2.Narrowing with if + typeof8m · 100xp🔒
  3. 3.Array.isArray — when typeof lies7m · 100xp🔒
  4. 4.instanceof for Date and custom classes8m · 100xp🔒
  5. 5.JSDoc @param and @returns: IDE hints without TS10m · 150xp🔒
  6. 6.JSDoc @typedef for object shapes12m · 150xp🔒
  7. 7.Discriminated unions in JSDoc12m · 175xp🔒
  8. 8.Optional chaining ?. and nullish coalescing ??7m · 100xp🔒
  9. 9.When NOT to add types7m · 100xp🔒
  10. 10.Capstone: refactor a tangled function with types14m · 250xp🔒
6

Module 06Iterators & generators

10 lessons

for-of, Symbol.iterator, yield, lazy sequences.

  1. 1.for-of vs forEach vs for-in7m · 100xp🔒
  2. 2.Iterating Maps and Sets8m · 100xp🔒
  3. 3.The iterator protocol10m · 150xp🔒
  4. 4.Generators: function* and yield9m · 150xp🔒
  5. 5.Lazy infinite sequences10m · 175xp🔒
  6. 6.yield* — delegating to another iterable8m · 125xp🔒
  7. 7.Async generators — async function*11m · 175xp🔒
  8. 8.Paginated fetch with async generator12m · 200xp🔒
  9. 9.Spread + destructuring with iterables7m · 100xp🔒
  10. 10.Capstone: streaming CSV parser15m · 275xp🔒
7

Module 07Errors & debugging

10 lessons

try/catch/finally, custom Error classes, Chrome devtools you actually use.

  1. 1.throw and catch — the basic shape6m · 75xp🔒
  2. 2.The Error object — name, message, stack6m · 75xp🔒
  3. 3.Custom Error classes9m · 125xp🔒
  4. 4.try / catch / finally7m · 100xp🔒
  5. 5.Narrowing errors with instanceof8m · 125xp🔒
  6. 6.Async errors — try/catch around await9m · 125xp🔒
  7. 7.Error chaining with the cause option8m · 125xp🔒
  8. 8.console beyond .log — group, table, time, trace7m · 100xp🔒
  9. 9.Defensive parsing of unknown input9m · 125xp🔒
  10. 10.Capstone: typed-error fetch wrapper14m · 250xp🔒
8

Module 08Testing without a framework

10 lessons

node:test, t.assert.deepStrictEqual, plain script tests on save.

  1. 1.Assertion functions — the foundation6m · 75xp🔒
  2. 2.Deep equality for objects and arrays8m · 100xp🔒
  3. 3.Roll-your-own test runner10m · 150xp🔒
  4. 4.Arrange–Act–Assert7m · 100xp🔒
  5. 5.Grouping with describe()9m · 125xp🔒
  6. 6.Spies — recording calls10m · 150xp🔒
  7. 7.Testing async code9m · 125xp🔒
  8. 8.beforeEach / afterEach9m · 125xp🔒
  9. 9.Helpful failure output7m · 100xp🔒
  10. 10.Capstone: test a small library15m · 275xp🔒
9

Module 09Browser platform APIs

10 lessons

localStorage, IndexedDB, fetch, AbortSignal, structuredClone, View Transitions.

  1. 1.localStorage — read, write, remove6m · 75xp🔒
  2. 2.Storing objects with JSON.stringify7m · 100xp🔒
  3. 3.sessionStorage vs localStorage5m · 75xp🔒
  4. 4.URL + URLSearchParams7m · 100xp🔒
  5. 5.structuredClone — proper deep copy7m · 100xp🔒
  6. 6.requestAnimationFrame — smooth animation8m · 100xp🔒
  7. 7.AbortController as a cancellation token9m · 125xp🔒
  8. 8.EventTarget — your own event bus9m · 125xp🔒
  9. 9.View Transitions for crossfade9m · 125xp🔒
  10. 10.Capstone: undo stack with structuredClone + localStorage15m · 275xp🔒

How access works: The first 12 lessons in this track are free — no signup needed. Locked lessons (🔒) unlock with a Pro subscription. See pricing.

Get one Python or web tip a day — by email

Short, hand-written, no spam. Unsubscribe in one click.