hugodatastarwebaws

Personal Website

This site. A Hugo-generated personal portfolio with Datastar-powered interactivity.

Timeline April 9, 2026

Overview

The site you’re reading. It’s a static Hugo build with a hand-written custom theme and Datastar for the small amount of client-side interactivity: tag filtering on the project list, the mobile menu toggle, and room to grow into SSE-driven demos later.

Design constraints I gave myself:

  • No framework. Datastar is vendored at v1.0.0-RC.8 and served from the local origin. No CDN, no build step.
  • No JS toolchain. Plain CSS, plain HTML templates, no bundler.
  • Reproducible dev shell. A project-local flake.nix pins Hugo via Nix so nix develop is the only setup step.

Highlights

  • Custom Hugo theme with baseof.html + auto-discovered home/single/list layouts.
  • Light and dark mode via prefers-color-scheme, no toggle needed.
  • Datastar directives (data-signals, data-on-click, data-class-*, data-show) for interactivity.
  • Total client JS payload measured in tens of kilobytes.
  • Small but contains just enough complexity to provide the most benefit.

Stack

  • Hugo
  • Datastar
  • Nix
  • S3