JavaScript labs

7 projects you build and run in the browser, each one assembling the language features from the curriculum into something that works.

• Todo App with a State Machine

  Arrays, objects, DOM, delegation and localStorage, driven by explicit states.

  intermediate · about 35 minutes

  arrays · dom · events · state-machine · storage

• Async Dashboard

  Concurrent fetches, loading and error states, retries and cancellation.

  intermediate · about 40 minutes

  promise · concurrency · abort · error-handling

• Canvas Particle System

  requestAnimationFrame, delta time, vectors and a performance budget.

  intermediate · about 30 minutes

  canvas · raf · performance

• Physics Playground

  Drive a real physics engine (Matter.js) from your own JavaScript.

  advanced · about 45 minutes

  dynamic-import · library-integration · events · cleanup

• Reactive Store with Proxy

  Build the core of a modern framework in about sixty lines.

  advanced · about 40 minutes

  proxy · reflect · observer · batching

• Mini Test Framework

  Closures, arrays and errors, assembled into a working test runner.

  intermediate · about 30 minutes

  closure · errors · async · api-design

• Debounced Search with Cancellation

  Debounce, AbortController and race-condition safety, done properly.

  intermediate · about 30 minutes

  debounce · abort · race-condition · a11y