Colophon
How this site is made
The tools, the type and the machinery behind nathanz.cloud.
What it is built with§
Next.js 16 with the App Router and React 19, in TypeScript throughout. Styling is Tailwind CSS v4 over Meridian, a set of components and colour tokens: every colour on the page comes from its tokens, so light and dark are one switch.
Data lives in SQLite, through libSQL and Drizzle: one file for accounts, updates, the guestbook and Juice, and one file for each Time Manager user, so one person's plan can be moved or deleted without touching anyone else's.
The tests run on Vitest, and every page is checked for accessibility with axe-core in a real browser, in both languages, in both themes and on a phone.
Type§
Inter for reading, Instrument Serif for headings, and JetBrains Mono for anything read as a number: dates, times, counts. The Latin font files come from the site itself.
Chinese uses the faces your device already has (PingFang, Noto or Source Han, Microsoft YaHei), with a Song face for headings, and is spaced as print spaces it. A Chinese font is several megabytes, too much to send with a page. Share cards, drawn on the server, carry their own small Noto Serif SC and Noto Sans SC.
On the page§
The marbled ink behind every page is a WebGL shader coloured from the same tokens. It never reacts to the pointer, and it holds still when your device, or the site's own setting, asks for less motion.
The header is glass: in Chromium an SVG filter bends what passes beneath its rim, and elsewhere it is frosted. It keeps enough paper behind its words to read over anything.
Sounds are a few soft paper clicks made in the browser, off until you turn them on in the command palette (⌘K or /), where larger text, reading mode and keeping the site still are too.
How it ships§
Every change is a commit pushed to GitHub. A small always-on server at home looks for new commits every two minutes, builds each one beside the copy that is running, switches over only once the build has succeeded, and then checks that the new copy is the one answering. A broken build never goes live.
Visitors reach it through a Cloudflare Tunnel, so no port is open at home. The Python and Java that Juice runs go to a locked-down container on the same machine: read-only, and with no network at all.
Privacy§
No ads, no trackers, and no scripts from anyone else: the fonts and everything else come from this site. Cookies are only for your choice of language, for staying signed in if you have an account, and for rejoining a Juice game after a refresh.
Views are counted, one a page per day, so I can see what is read: only the page's address is sent, with no cookie, address or ID, so a count is views rather than people. If your browser asks not to be tracked, nothing is sent at all.
This copy
- Running
- 0256879
- Code last changed
- Changes so far
- 183 changes
- Right now
- See the status