Tag: Vue.js

1. Nuxt Content: Building Markdown Based Pages the Right Way

   Dec 24, 2025

   Nuxt Content turns a plain directory of markdown files into a full featured, searchable data source with automatic routing, a query builder and Vue components right inside the text. For anyone maintaining documentation, blogs or marketing pages without an external CMS, Nuxt Content is the missing link between static text and a dynamic Vue application.

   Read more

2. Vue Reactivity Performance: shallowRef, markRaw, toRaw

   Dec 24, 2025

   Blindly wrapping every object in Vue 3 with reactive costs a measurable Proxy overhead once datasets grow large. This Vue reactivity performance guide shows how shallowRef, shallowReactive, markRaw and toRaw relieve the reactivity system deliberately, without losing functionality.

   Read more

3. Vue Macros and Compiler Macros: Beyond defineModel and defineProps

   Dec 22, 2025

   Compiler macros such as defineProps and defineModel look like normal function calls but do not exist at runtime at all, the Vue compiler transforms them away while building the code. The dedicated Vue Macros plugin goes further and adds its own macros for reactivity, prop forwarding and conditional compilation, with clear tradeoffs in tooling and predictability.

   Read more

4. Vue and Tailwind: Sensible Patterns Instead of Class Soup

   Dec 10, 2025

   A button with 30 Tailwind classes in the template is not a Tailwind problem, it is an architecture problem. Vue and Tailwind can be combined so that class logic lives in computed properties, variants are managed through cva and templates stay readable, without sacrificing the expressiveness of Tailwind.

   Read more

5. Form Builder and Dynamic Forms in Vue 3

   Dec 1, 2025

   Forms that get generated from configuration instead of being hard-coded save development time and let back-end teams change form structures without a frontend deployment. This article shows how to build a robust form builder in Vue 3, from field definitions through dynamic validation to conditional fields.

   Read more

6. Rate Limiting in Nuxt Server Routes: Strategies and Implementation

   Nov 28, 2025

   Without rate limiting, a single client can overwhelm a Nuxt Server Route with thousands of requests per second, whether from a misconfigured client, a bot, or a targeted attack. Token bucket algorithms, Redis based limiting, and a correct 429 error format protect the API without slowing down legitimate users.

   Read more

7. Responsive Vue Component Patterns: Solving Breakpoints Cleanly

   Nov 22, 2025

   Responsive Vue components often fail with plain CSS media queries, because a component needs to behave differently depending on its layout context, regardless of viewport width. Container queries, custom breakpoint composables, and adaptive slot structures solve this structurally instead of piling on more CSS exceptions.

   Read more

8. Accessibility in Vue Components: Focus, ARIA and Keyboard Support

   Nov 22, 2025

   Accessibility in Vue applications is not an optional add-on requirement, it is technical quality. Anyone who builds focus management, ARIA attributes and keyboard navigation into Vue components from the very start creates interfaces that work reliably for all users while also meeting legal requirements such as the European Accessibility Act.

   Read more

9. Using Teleport, Suspense and Async Components in Vue 3 the Right Way

   Nov 19, 2025

   Vue 3 introduced three features that are rarely explained together, yet complement each other perfectly: Teleport for correct DOM placement, Suspense for declarative loading states and Async Components for targeted code splitting. Anyone who understands all three and combines them sensibly builds Vue applications with better UX, smaller bundles and a cleaner component architecture.

   Read more

10. Migrating Options API to Composition API Step by Step

    Nov 18, 2025

    Migrating from the Options API to the Composition API does not have to mean overhauling every component at once. Vue 3 allows both styles side by side in the same project, so data, methods and computed can be translated cleanly into the Composition API component by component, while the rest of the application keeps running unchanged.

    Read more