Thoughts on frontend architecture, design systems, and engineering leadership. Documenting the intersection of structural integrity and user experience.
We evaluated WebSocket, WebRTC, and SSE for a browser voice assistant. Here's the full breakdown — the tradeoffs, the architecture, and the protocol that maps cleanest to the problem.
How this portfolio resizes images, serves WebP/AVIF, and builds responsive srcset URLs — with @unpic/react on the client, a TanStack Start /api/images route, and sharp on the server.
A full walkthrough of AI skills and rules — what they are, how to create them, what good content looks like, and how to verify the assistant actually follows them.
A three-layer token pipeline — CSS variables, Tailwind utilities, component variants — explained with real examples from light/dark themes to button styling.
PostgreSQL, Docker, and Prisma from zero — schema models, SQL migrations, seed scripts, and a typed client, explained as a connected pipeline.
The full client-server data pipeline — server functions, query configs, route loaders, SSR hydration, and mutations — explained step by step with real code.
CI, Docker, and cloud deployment as a three-station pipeline — with real Dockerfile, startup script, and GitHub Actions examples.
Explore how functional programming concepts like immutability, pattern matching, and composition can improve the predictability and safety of your TypeScript applications.
What package.json scripts are, how to add your own, and a grouped reference of the commands that power dev, database, testing, and production workflows.
White-labeling explained — build-time brand switching with env vars, Vite aliases, token files, and a checklist for adding a new brand.
SSR, hydration, and FOUC explained — then the cookie + inline-script + server-function pattern that keeps dark mode in sync from first paint.
A deep dive into WCAG AA criteria for modal dialogs, including focus trapping, keyboard navigation, and aria attributes using vanilla TypeScript.
Install, run, write stories, add interaction tests, and build a shareable static site — a complete Storybook tutorial with real component examples.
Set up Vitest and Storybook testing from scratch — config, first unit test, coverage, interaction tests, and how to pick the right layer.
Meta tags, Open Graph, JSON-LD, sitemaps, and robots.txt — a complete SEO walkthrough for server-rendered React apps with real head-builder code.
