Web Dev Academy Core languages · JavaScript Tool 3 / 64
Core languages

JavaScript

The language of behaviour. JavaScript reacts to the user, changes the page, talks to servers and powers every interactive thing on the web.

Demo 01

A live, ticking clock

JavaScript updates the page over time. This clock refreshes every second using setInterval and the Date object.

--:--:--
Demo 02

Instant search filter

As you type, JS filters a list in real time — the everyday magic behind every search box.

    Demo 03

    A working to-do list

    Add and remove items — JS creates and destroys DOM elements on the fly.

      Demo 04

      Array methods playground

      Pick a transform and watch map, filter and reduce reshape the data live.

      Input:
      Output:
      Demo 05

      Events: live mouse tracking

      JS listens for events. Move your mouse inside the box — it follows you and reports coordinates.

      move your mouse here
      Demo 06

      Generate & animate with the Canvas API

      JavaScript can draw. Click to scatter a fresh burst of animated circles, and roll a random colour.

      #______
      i
      Built with only vanilla JavaScript — no frameworks, no libraries. Every demo uses core browser APIs: setInterval, DOM manipulation, event listeners, array methods and the Canvas API. The shared CSS shell provides the page styling.

      ↑ All 64 tools