Dieses Portfolio
Next.js 16, React Three Fiber and a live counter for real Claude token usage.
- Languages
- DE / EN
- Data source
- Claude Code Logs
About the project
A portfolio that doubles as a work sample: the backdrop renders my career as a graph, all copy lives in a typed content layer, and the site is bilingual from the ground up.
The standout detail is the token counter. A sync script aggregates local Claude Code session logs into an anonymised snapshot that the site serves through an API route and animates live. No estimates, real usage data.
The actual work is in making that number correct. Claude Code writes a log line per streaming update, so a single response appears several times. Summing every line overstates output by roughly 4×, taking only the first understates it by as much. The script groups by request and keeps the final state.
Technically the site makes sure the visual effort stays free: the 3D scene loads after first paint, pauses on a hidden tab, and disables itself entirely on reduced-motion settings, small viewports or weak hardware. A CSS gradient remains.