Skip to content

site notes

About this site

The stack, systems, and craft decisions behind this Next.js portfolio.

Application core

Next.js App Router, React, and TypeScript shape the public routes, admin surfaces, and server-rendered content.

Next.js 16React 19TypeScript

Interface layer

Tailwind tokens, Radix primitives, and restrained motion carry the glass HUD and archive/pixel visual language.

Tailwind 4RadixMotion

Content and data

Zod-validated content falls back cleanly while Supabase powers accounts, saves, comments, and admin edits.

SupabaseZodnext-intl

Commerce and email

Stripe handles checkout paths, Resend handles transactional mail, and Vercel keeps previews close to production.

StripeResendVercel

Quality gates

ESLint, TypeScript, Playwright, and Storybook cover the pieces that need to keep behaving as the site grows.

ESLintPlaywrightStorybook

Delivery surface

ISR pages, route metadata, sitemap generation, and OG image handlers keep the archive crawlable and shareable.

ISROG imagesSitemap

public trail

Want the ship log?

The changelog mirrors the repository history in a visitor-readable form, without exposing private project notes.

Read changelog
open channel
--:--:--EST
get in touch

Saw something here?Tell me about it.

It's a portfolio, not a service · but I read every note — drop a line if anything here resonated, or just to say hi.

Newsletter

Get the occasional dispatch

Notes and logs from m4rkyu.com — short, dated, no noise. Unsubscribe anytime.

M4RKYU
Crafted since 2024
© 2026 ZhenXiao Mark YuOntario, Canada

Built with Next.js 16 · React 19 · Tailwind 4