Skip to content

Web Technologies Mind Map

A structured, teachable map of web technologies — from internet basics, through the evolution of the web, to modern development practice. Built as a teaching tool and usable as a quick reference.

193 concepts across six sections, each with a definition and links to authoritative sources.

  • :material-graph-outline: Interactive mind map

    Two views of the same data: a collapsible tree, and a force-directed graph that draws the cross-links between sections. A single self-contained file — it works offline, with no accounts and no plugins.

  • :material-map-marker-path: Learning paths

    Four teaching sequences through the same concepts, with week and hour estimates — front-end, back-end, full stack, and semantic web.

  • :material-book-open-variant: Reference

    Every concept in full, grouped by section. Each has a stable anchor you can link from slides.

How to use this

  • Following a course? Start from a learning path — the map is organised by what things are, which is not the order to meet them in.
  • Start with the mind map's tree view to see the shape of the field.
  • Switch to the graph view to see how the areas relate across section boundaries — the dashed edges are see_also links, and they are the only place those relationships are visible.
  • Use the reference when you need a definition or a primary source for one specific thing.
  • Search (top of the page) covers every definition, not just titles.

Concepts are marked emerging where a technology is still settling, and legacy where it is superseded but still widely encountered in older tutorials — jQuery, AngularJS and Heroku, for example. Nothing is deleted for being dated, because students meet dated material and need to recognise it.

Before the details

Two primers come before the main sections, on the assumption that the web makes more sense once the surrounding computer science does:

A note on Web 3.0

In this map, Web 3.0 means the Semantic Web — the W3C programme of making data machine-readable through RDF, ontologies and linked data. Web3 is a separate, later term from the cryptocurrency industry. The two are routinely conflated; the disambiguation note explains the difference.

Source and licence

The map is generated from structured concept data in the repository, so the diagram, this site and the README cannot drift apart. Corrections and additions are welcome — see CONTRIBUTING.md.

Content is licensed CC BY-SA 4.0; the generator code is Apache 2.0.

An accompanying video walkthrough introduces the map.