oCamlCase
2026React + TypeScriptocamlcase.dev ↗source ↗
An interactive site for learning OCaml through mental models instead of memorized syntax.
- concepts
- 27 pages
- exercises
- 33 mini + 6 projects
- labs
- 4 interactive
- license
- open source
What it is
Each of the 27 concept pages is built around one mental model, from bindings and closures to type inference and tail recursion. Two navigation modes cover different needs: a flat Reference and a step-by-step Guided Path. Progress is saved in localStorage; no account, no tracking.
Labs
- Type derivation tree: a real typechecker, written in TypeScript, that draws its reasoning as a tree.
- Tree explorer: one rose tree, four view modes (tour, linearize, project, balance).
- Interpreter pipeline: scrub an expression through six stages, from characters to tokens to a tree to a value.
- Playground: the real OCaml toplevel, compiled to JavaScript, running in the browser.
Technical notes
- The elaborator, parser and evaluator are custom TypeScript implementations, not an embedded third-party widget.
- Route-level code splitting brought the bundle from 840 kB to 655 kB.
- Per-route prerendered heads and a generated sitemap cover 105 routes.
- Deployed on GitHub Pages; CI runs the test suite before every build.
Try it at ocamlcase.dev ↗ocamlcase.dev
free · no account
Motivation
OCaml is the introductory functional programming language at TUM, and most tutorials for it are syntax-first. This is the mental-model-first resource I wanted to have while learning it.
What I learned
Implementing the typechecker and interpreter myself deepened exactly the understanding the site tries to teach. Explaining concepts to others forces precision, and shipping the site was solid practice in bundling, SEO and CI.