Page 3 - Monthly Archives: December 2025

runtimeConfig is built for values that can still change after the build, for example because the same Docker container runs in several environments with different API endpoints. The difference between public and private values directly determines whether a value ends up accidentally exposed as a secret in the client.

A React form with validation, loading state and error handling needed at least five useState hooks in React 18, an onSubmit handler, a fetch call and manual rollback logic. React Actions in React 19 do the same job with a single hook and one action function, and they work even without JavaScript in the browser.

prefers-color-scheme is more than a media query for light and dark. The color-scheme property, a clean user override and the right order at first render decide whether dark mode feels seamless or starts with a visible flash of the wrong theme.

At first glance static properties look like a convenient place for class wide state, such as a counter or a registry. Once inheritance enters the picture, though, a pitfall appears that regularly surprises experienced developers: a static property declared in the base class is not duplicated per subclass, it is shared by all subclasses unless explicitly redeclared. This article walks through the problem with concrete examples and describes ways to avoid it reliably.

A vaguely defined metric leads to contradictory reports, even when the underlying query is technically correct. Claude helps pin down precise KPI definitions, build cohort analyses and consolidated metric views, and automate recurring reports. This article covers the path from a fuzzy business question to a reliable business intelligence report.

Product filters that only work with a mouse, or that drop focus after every selection, effectively lock out keyboard and screen reader users. This article shows how to mark up checkboxes, radio buttons, and price sliders correctly in a layered navigation, make them keyboard operable, and combine them with live regions for updated result counts, all without losing focus when the product grid reloads.

Cumulative Layout Shift is one of the three Core Web Vitals and measures how much visible elements on a page unexpectedly change position while a visitor is already interacting with or reading the page. A high CLS score leads to mis-clicks, lost reading position, and a general impression of instability, even when every other performance metric looks good. The four most common causes, images without dimensions, late-loading ad banners, web font swap, and content dynamically inserted above existing content, can be tracked down systematically with the Layout Instability API and the browser DevTools, instead of stumbling onto them by accident during testing.

A watch() on a flat property works reliably right away in Alpine.js. But as soon as a nested object or an array of objects needs to be watched, surprises show up: changes get missed, callbacks fire too rarely or too often. This article shows how deep watching in Alpine.js actually works and which patterns make it reliable.

Nearly every application contains logic that depends on the current time: voucher expiration dates, deadlines for order cancellations, or time-gated feature rollouts. When that time is fetched through a direct new \DateTime() call in the code, any test that needs to simulate a specific moment either turns into a fragile construction built on real sleep calls or becomes outright impossible to write. The Symfony Clock component solves this by treating the current time as an injectable dependency that can be swapped for a deterministic implementation in tests, without a single millisecond of real waiting.

The paths option in tsconfig.json makes imports like @/components readable and stable, but it only solves type checking, not module resolution at runtime. This article shows how to carry aliases correctly all the way into Vite, Webpack, Node, and test runners, so no module-not-found error shows up after the build.