boonyarit.me

Overview

boonyarit.me is my personal site. It's where I publish what I write and what I build, and where hiring teams and clients can reach me or download my resume. I build and maintain it myself, and it's still under active development.

The design

The site is laid out like a hangar tool board. On a shadow board every tool has its own painted outline, so anyone can see at a glance that nothing is missing. Here, every article and project hangs in its own outlined slot, labelled with a position code on yellow tape. A project's status is drawn as its outline: solid for stable, heavy for active, dashed for experimental, and a dash-dot line for maintenance.

Day mode is a grey powder-coated board. Night mode is charcoal tool foam with yellow outlines, like the under-layer that shows when a tool is out of its cut-out.

How it's built

• Next.js App Router and TypeScript. Most pages are generated statically at build time.
• Velite turns local MDX files (articles, projects and the about page) into typed data during the build, with syntax highlighting from Shiki.
• Tailwind CSS for styling, with Radix primitives for accessible menus, drawers and form controls. Fonts (Big Shoulders and Barlow) are self-hosted.
• Contact form: a type-safe server action validates input with Zod and sends the message by email, through Resend or SMTP depending on configuration.
• Checks: GitHub Actions runs Biome, TypeScript, Vitest, a dependency audit and a production build on every change. Locally, each commit is linted and formatted, and its message is checked against Conventional Commits.
• Hosting: deployed on Vercel.

Links

• Live site
• Source on GitHub