Does a carousel really need a JavaScript framework? This example builds a slider with HTML and CSS, then adds navigation between slides. It is an invitation to look at what the browser already provides before turning another interface element into a JavaScript component.
Can surplus solar energy trigger useful HomeKit automations? I connect a HomeWizard Wi-Fi P1 Meter to Homebridge through a custom plugin, turning electricity data into sensors my smart home can use. The article covers the API, accessory setup, polling and installation.
Nuxt's asyncData and fetch hooks need a different testing approach from ordinary Vue component methods. This article demonstrates calling hooks directly and supplying their context explicitly. It also draws the boundary around those tests: checking a hook's logic is useful, but it does not prove that Nuxt invokes it correctly during navigation or rendering.
The browser console has more to offer than a stream of log messages. I share three useful JavaScript methods: console.log, console.dir and console.table. The examples cover inspecting objects, presenting arrays as tables and selecting columns, plus a subtle debugging trap: an object shown in the console may have changed since you logged it.
Components and directives both support reuse in Vue, but they solve different problems. Using a counter and a focus directive, this article shows when to package a piece of interface and when to attach behaviour directly to an element. It also explains the Vue 2 directive hooks and why clear responsibilities matter more than simply reusing code.
Google's retirement of data-vocabulary.org left many websites with breadcrumb warnings in Search Console. This article shows how the old markup differs from schema.org and provides examples using microdata and JSON-LD. It also explains how to check the replacement with the Rich Results Test before considering the warning resolved.
Editing a component in AEM can replace its HTML without restarting Vue, leaving the component invisible in the editor. This article walks through the integration problem and a custom refresh approach, including iframe handling, to keep Vue components working during authoring.
A website can respond to the visitor's system appearance through prefers-color-scheme. This article introduces dark-mode styles and switching images with the same media query, using the browser support available at the time. A practical starting point for making more than just the page background adapt to a dark theme.
How should Vue components share data without becoming tightly coupled? This article compares props and events, the Vue 2 .sync modifier and an event bus, alongside the pitfalls of reaching directly into parent or child instances. The aim is to make communication explicit while keeping components understandable and reusable.
