Typescript

TypeScript projects and write-ups: safer JavaScript for frontend apps, games, and tools, with real examples from production and side projects.

Typescript projects

  1. 3 Apr 2026

    Screen recording of the map gesture control demo showing an OpenLayers map with a small webcam preview in the corner. A user pans the map by making a fist and moving their hand, then zooms by spreading two open hands apart. All hand tracking and gesture detection runs in the browser using MediaPipe WASM with no backend.

    Open Source Hand Gesture Controls for Maps in the Browser

    Open source library for controlling OpenLayers, Google Maps, and Leaflet with hand gestures. Pan, zoom, and rotate maps without touching the screen.

  2. 15 Mar 2026

    Face-controlled Tetris game where a player moves pieces by raising eyebrows and opening their mouth using webcam face detection.

    Eyebrow Tetris: Face Controlled Browser Game

    A browser Tetris game controlled by your face. Raise your eyebrows to rotate, tilt your head to move pieces. Built with MediaPipe face mesh tracking.

  3. 2 Mar 2026

    Pug's Hunt browser game using webcam hand tracking to aim and shoot ducks

    Pug's Hunt: Webcam Duck Hunt with Hand Tracking

    A webcam-controlled browser game inspired by Duck Hunt. Point your hand to aim, make a finger gun to shoot. Built with MediaPipe hand tracking and Next.js.

  4. 18 Feb 2026

    3D Toilet Paper Roll Simulator

    3D Toilet Paper Roll Simulator with Real Thermal Printing

    A 3D toilet paper roll simulator with Three.js that prints whatever you type on a real thermal printer. Drag to unroll, watch the paper stack on the floor.

  5. 10 Apr 2025

    Screenshot of project page showing portfolio

    Portfolio

    A developer portfolio built with Next.js and Sanity CMS. Statically generated, fully accessible, with structured data and SEO built in from the start.

  6. 4 Aug 2024

    Arduino 3d printed wordclock

    Arduino 3d printed dutch word clock with minute accuracy

    A 3D printed Dutch word clock with minute accuracy, built with Arduino. Unlike most word clocks that update every five minutes, this one shows the exact time.

  7. 1 Jan 2020

    Open GeoWeb

    Open GeoWeb

    Open source web platform for real-time weather monitoring and geospatial data visualization. Built for meteorologists to create forecasts, alerts, and warnings.

Typescript articles

  1. 12 Apr 2026

    Gesture Controls for OpenLayers, Google Maps & Leaflet

    Gesture Controls for OpenLayers, Google Maps & Leaflet

    Add open source hand gesture controls to OpenLayers, Google Maps and Leaflet with MediaPipe hand tracking. Pan, zoom and rotate maps by webcam.

  2. 20 Apr 2025

    Responsive Header that Changes on Scroll (CSS & JS)

    Responsive Header that Changes on Scroll (CSS & JS)

    Step-by-step tutorial on building a responsive sticky header with scroll-based behaviour using vanilla HTML, CSS and JavaScript. No frameworks needed.

  3. 14 Apr 2025

    Building a Portfolio with Next.js and Sanity (Headless CMS)

    Building a Portfolio with Next.js and Sanity (Headless CMS)

    How I built a portfolio and blog with Next.js and Sanity CMS using TypeScript, Tailwind CSS, JSON-LD and Vercel. Full source code included.

  4. 9 Feb 2025

    How to Build a 3D Printed Arduino Word Clock (Minute Accuracy)

    How to Build a 3D Printed Arduino Word Clock (Minute Accuracy)

    A step-by-step DIY build guide for a 3D printed Dutch word clock with minute accuracy, using Arduino, WS2812B LEDs, and a custom letter grid designed in Fusion 360.