COLOPHON

วิธีสร้าง


Stack

Framework: Astro 6.x — static, zero JavaScript โดย default
Interactive: React 19 ใน Astro Islands (client:load) สำหรับเครื่องคิดเลข
Content: MDX files ใน src/content/ — Git คือ CMS
Styling: Tailwind CSS v4 (CSS-first)
Search: Pagefind — ทำงาน client-side จาก static index
Hosting: Cloudflare Pages
Assets: Cloudflare R2 (beef-assets bucket)

Typography

Anuphan — display headlines, Thai, brand wordmark
Sarabun — body Thai prose
IBM Plex Mono — labels, technical, dates, badges
ทุก font โหลดจาก Fontsource — self-hosted, zero Google Fonts

Visual language

ความรู้สึก "สมุดบันทึกมือเขียน" สร้างจาก pure CSS ทั้งหมด — ink-settle reveal, SVG stroke draws, typewriter entry, tape-settle ScrapCards ไม่มี animation library ใดๆ

Zero-JS policy

บทความทุกชิ้นใช้ JavaScript เป็นศูนย์ — ยกเว้น IntersectionObserver เล็กๆ สำหรับ ink-settle reveal ที่หน้าหลัก เครื่องคิดเลขใช้ React Islands (client:load) แยกเฉพาะหน้า tools /search/ เป็นหน้าเดียวที่โหลด Pagefind bundle

Accessibility

ทุก animation มี prefers-reduced-motion override ที่ตัด animation ลง 0.01ms SVG illustrations มี aria-hidden="true" ทุก interactive element มี focus state ที่มองเห็นได้