Practical articles about the client side of web applications: CSS, JavaScript, Vue.js, interface architecture, responsive behavior, browser behavior, and problems encountered in real projects. The focus is on issues I actually had to diagnose and solve during development rather than isolated examples.
One platform may already show the new Open Graph image while another still serves an older preview. That does not always mean your meta tags are wrong. Debug HTML, SSR, og:image accessibility, HTTP responses, and each crawler cache separately.
A click on Copy Link shows user intent, but it does not prove that the link actually reached the clipboard. If an action can fail, record the success event only after the operation has actually completed.
In an SPA, an unread notification counter may stay correct while the tab is active and become stale after sleep, a background tab, or browser cache restoration. WebSockets are useful for live updates, but returning to the tab should reconcile state with the server.
The interface may render correctly while Vue still warns about the default slot. The cause is simple: when h() creates a component vnode, its content should be passed as a slot function rather than a raw string.
When a filter changes, the current page of the previous result set is no longer meaningful. But resetting pageIndex inside a watcher can easily trigger two identical requests. I show how to coordinate both reactions without duplicate loading.
I changed a margin or padding in SCSS, refreshed the page, and nothing happened. This is the practical debugging flow I use to trace the problem through source, build, compiled CSS, DOM, cascade, stylesheet order, and only then cache.
In MessageAttachments.vue, an attachment card used one anchor to open a file and another nested anchor to download it. This article shows why @click.stop does not fix invalid HTML, how browser parsing can change the DOM, and why the two actions should be sibling interactive elements.
After reordering Content Blocks in a Vue editor, block UI labels could unexpectedly appear inside Rich Text content: locale, position, anchor help, editor labels, and other interface text. This article explores why drag and drop around contenteditable needs stable Vue keys, strict DOM boundaries, correct editor lifecycle handling, and an explicit content synchronization contract.
In the ICanUp editor, Media Explorer opened above Content Blocks, yet parts of the underlying editor could still render over the modal layer. This article explains why a huge z-index is not always enough, how CSS stacking contexts work, and why overlays need a clear layer contract instead of arbitrary numbers.