Skip to content

~/colophon

What this site is built with, and why each piece earns its spot in the bundle. The source is on GitHub if you want to dig in.

view source ↗

$ cat concept

A build-system portfolio: it presents as precision-crafted software, not a webpage. Monospace-only type, terminal grammar, a command palette instead of a navbar, and a vim-style statusline. Content starts low-fidelity and decodes into the finished thing — headings settle from scrambled glyphs, project previews resolve from ASCII dither. Dark-only, one font, one accent.

$ cat tokens

Aa

display 700

Section title

section 700

Body copy 14px

body 400

meta 11px

meta

## framework + runtime

  • Next.js 16 (App Router) ↗

    Server components for static-first rendering, route-level OG image generation, and zero-config Vercel deploys.

  • React 19 ↗

    Server actions for the contact form, refined transitions, and the new useSyncExternalStore hooks scattered through the UI.

  • TypeScript 5 ↗

    Strict mode across the repo. Pinned at ^5 because next-intl@4's peer dep blocks 6 for now.

## styling + animation

  • Tailwind CSS v4 ↗

    Utility-first styling. v4 lets us define brand colours and tokens directly in CSS via @theme.

  • GSAP + ScrollTrigger ↗

    Scroll-reveals, the velocity-reactive ticker, text-scramble, and the magnetic CTA. All plugins are free.

  • lenis ↗

    Smooth scrolling on desktop. Skipped on touch and on prefers-reduced-motion.

## content + i18n

  • next-intl ↗

    Locale-aware routing under /[locale]. Currently English only, but the structure lets Hindi land without a refactor.

  • JetBrains Mono ↗

    The single typeface for the entire site — weights 400 and 700, self-hosted via next/font.

## infrastructure

  • Vercel ↗

    Edge hosting, CDN, preview deployments per PR, and free Analytics + Speed Insights.

  • nodemailer + Gmail SMTP ↗

    Contact form delivery via the server action. Server-side captcha re-check + per-email rate limit.

  • Sentry (optional) ↗

    Wired into next.config but disabled until the DSN is set on Vercel. Runs zero overhead until activated.

## tooling + ci

  • ESLint + Prettier + Husky ↗

    Pre-commit lint+format, pre-push typecheck. Stops broken commits before the remote sees them.

  • Vitest 4 + Vite 8 ↗

    Fast unit + a11y tests via vitest-axe. Same Vite dev experience as Next, no extra config.

  • GitHub Actions ↗

    CI runs lint+format+tsc, tests, and a production build in parallel. Lighthouse CI runs separately. Bundle-size budget enforced at 600 KB gz.

  • Dependabot ↗

    Security advisories daily, monthly patch-only routine PRs. Ignores typescript and eslint majors until upstream catches up.

built by ubed khan — AI-assisted, human-directed. source ↗