Blog
Thoughts on things I'm building and learning.
What Happens When a Request Hits Your Next.js App
Every request passes through middleware, layouts, and the page component in a fixed order. Knowing that order tells you exactly where to put auth guards, session refreshes, and data fetching.
next.jsapp-routermiddlewareserver-componentsarchitectureNext.js Components Are Server-First — and That Changes Everything
App Router components run on the server by default. That one inversion explains why 'use client', 'use server', Server Actions, and Route Handlers all exist.
next.jsreactserver-componentsserver-actionsapp-routerWhy <Component /> and Component() are not the same thing
JSX and direct function calls produce identical output but React treats them completely differently — because only one of them gets a fiber.
reacttypescripthookswhileHover on a child motion element doesn't respond to parent hover
Why a child motion element's whileHover only fires on its own hit area, and when to use Framer Motion variants vs CSS group-hover instead.
framer-motionreactcsstailwinduseState lazy initializers are a hidden hydration trap
Why typeof window guards don't protect lazy initializers from hydration mismatches, and how useSyncExternalStore fixes it with real subscriptions.
reactnextjshydrationssrhooksWhat's Inside Elysia's Context Object
Elysia passes a single context object to every handler — understanding what's in it and how it's built explains every pattern you'll encounter.
elysiabuntypescriptweb-frameworkWhy Your Scraper Gets Nothing: SSR vs CSR Explained
Whether you need a headless browser or a plain fetch call depends on when the framework builds the HTML — server-side or client-side.
web-scrapingplaywrightcheerionext.jstypescriptFrom useState to useSyncExternalStore for mounted guards
Why the useEffect + setState mounted guard triggers a lint rule, and how useSyncExternalStore is the React-official way to handle server/client value differences.
reactnextjshydrationhooksssrMigrating from MongoDB to JPA: the mental model
What I had to unlearn about MongoDB to make sense of JPA — entities, foreign keys, and why a List<String> suddenly needs its own table.
javaspring-bootjpapostgresqlmongodbFixing the next-themes hydration mismatch
Why reading useTheme() directly causes a React hydration error, and how a mounted guard fixes it.
nextjsreactnext-themeshydrationssrThe grid-template expand animation
How animating grid-template-rows and grid-template-columns lets you expand an element from zero to auto without JavaScript, and why max-height is the wrong tool for the job.
cssanimationtailwindlayoutNext.js Font Variables and Tailwind @theme
What inter.variable and antialiased actually do, and why @theme and @theme inline behave differently in Tailwind v4.
nextjstailwindcssfontsCanvas Text Layout
How a canvas-based text layout engine inverts CSS — measuring text, carving slots around obstacles, and reflowing around moving objects in real time.
canvastext-layouttypescriptanimation