Colophon

Last updated August 19, 2026

Built by Yehor Brodskiy in 2026.

The stack

Next.js renders every route on the server. The code is TypeScript on both ends, the frontend and the CMS, and the styling is Tailwind CSS, set up CSS-first with design tokens and no config file at all.

The content lives in Strapi, every section, project and page of it. The frontend reads it over GraphQL, and PostgreSQL sits under Strapi as the database.

next-intl routes the locales, and Tolgee holds the interface strings, so there's no English or Ukrainian text typed into a component anywhere. The WebGL scenes, the layer cube and the contact scene, run on React Three Fiber, and Motion takes care of the scroll and interaction animation.

The type

Body text is set in Fixel, the variable version, a Ukrainian typeface by MacPaw that they released for free. One Fixel file carries a weight axis from 100 to 900 and a width axis from 75 to 100, so the narrow Text cut and the wide Display cut both come out of the same file. Its stylistic alternates, ss01 to ss14, are always on, everywhere.

Headings and display text are set in Cy Grotesk Std Grand Demi by Maksym Kobuzan. It's one static weight, with no italic and no variable axes, and its 683 glyphs cover Cyrillic as well.

The monospace face is JetBrains Mono, by JetBrains. It sets the code, the identifiers and the stamped dates.

Hosting

The Next.js frontend and the Strapi CMS both run on infrastructure I host and operate myself, with Cloudflare on top for DNS and at the edge. Media comes from the same self-hosted storage as well.

How it fits together

flowchart TD
  subgraph browser["Your browser"]
    PAGE["Rendered page, fonts from this origin"]
    R3F["React Three Fiber scenes"]
    MOTION["Motion, scroll and interaction"]
    SRW["Serwist service worker, offline fallback"]
  end

  subgraph edge["Edge"]
    CF["Cloudflare, DNS and edge"]
  end

  subgraph app["Application, self-hosted"]
    NEXT["Next.js server, renders every route"]
    INTL["next-intl, locale routing"]
    ACTION["Server action, contact form"]
    IMGOPT["Image optimizer"]
  end

  subgraph content["Content and strings"]
    STRAPI["Strapi"]
    TOLGEE["Tolgee"]
    FALLBACK["Bundled translation JSON, fallback"]
  end

  subgraph data["Data"]
    PGC[("PostgreSQL, content")]
    PGT[("PostgreSQL, Tolgee")]
    SEAWEED[("SeaweedFS, media and string bundles")]
  end

  PAGE -->|"request, form submit"| CF
  CF -->|"request"| NEXT
  NEXT -->|"rendered HTML"| PAGE
  PAGE --> R3F
  PAGE --> MOTION
  PAGE --> SRW

  NEXT --> INTL
  NEXT --> ACTION
  NEXT --> IMGOPT
  INTL -->|"en and uk, mapped to uk-UA and uk-ua"| STRAPI
  NEXT -->|"GraphQL, read all content"| STRAPI
  ACTION -->|"GraphQL, write submission"| STRAPI
  NEXT -->|"read published string bundle"| SEAWEED
  NEXT -.->|"when the bundle cannot be read"| FALLBACK
  TOLGEE -->|"publish string bundle"| SEAWEED
  IMGOPT -->|"fetch original media"| SEAWEED
  STRAPI -->|"content rows"| PGC
  STRAPI -->|"media, S3 compatible upload"| SEAWEED
  TOLGEE -->|"interface strings"| PGT

Your browser only ever talks to this site. Content, interface strings, media and fonts are all read on the server and arrive together with the page, so no third-party host gets called while you're reading. The one exception is Microsoft Clarity, and it loads only if you say yes to it.

Open source

Some of the tools here started as things I needed and couldn't find anywhere.

prpcow is an open protocol for communication between the driver, the client and the gateway. It was built for a live dispatch platform, and it's on npm under the MIT license. rust-wasmpack-loader compiles Rust to WebAssembly in the normal bundle step, across 8 build tools, so a .rs file imports like any other module.

The CV PDFs are typeset with Typst, and their layout follows the classic theme of rendercv (MIT license).

Thanks to the clients and colleagues whose work is on these pages, to the maintainers of every tool on this list, to MacPaw for releasing Fixel for free, and to Maksym Kobuzan for Cy Grotesk.

See the work

The projects behind everything listed here.

See the work