Hi 👋
No personal updates this week — just a bunch of interesting Vue & Nuxt content for you.
Enjoy this issue and have a lovely week ☀️
Vue
🛠️ ScriptShifter
👉🏻 A tool that converts Vue components from Options API to Composition API.
🛠️ code-inspector
👉🏻 Once installed, use ALT+SHIFT to position your cursor at that location in the code in your IDE.
👉🏻 Supports a number of tools and frameworks (React, Vue, Webpack, etc) along with 10+ IDEs.
💡 Vue Tip: Dynamic Event Names
Did you know you can use dynamic event names in Vue? Instead of hardcoding event listeners, you can bind them dynamically using v-on (@)
v-on (@) with computed event names:
1 < script setup lang = " ts " >
2 const event = ref < ' mouseover ' | ' click ' >( ' mouseover ' );
3
4 const buttonLabel = computed (() =>
5 event . value === ' mouseover ' ? ' Hover Me ' : ' Click Me '
6 );
7
8 const onHandleEvent = () => {
9 console . log ( ' Event triggered: ' , event . value );
10 };
11 </ script >
12
13 < template >
14 < div >
15 < div >
16 < span > Select an event type: </ span >
17 < div >
18 < label >
19 < input type = " radio " name = " event " v-model = " event " value = " mouseover " />
20 On Hover
21 </ label >
22
23 < label >
24 < input type = " radio " name = " event " v-model = " event " value = " click " />
25 On Click
26 </ label >
27 </ div >
28 </ div >
29 < button @[ event ]= " onHandleEvent " > Click or hover </ button >
30 </ div >
31 </ template >
You can try it yourself in this StackBlitz playground:
✨ Open Demo
Nuxt
📕 Nuxt on the Edge with Cloudflare Workers
👉🏻 "I stepped out of Vercel's comfort zone into Cloudflare's edge ecosystem. Here's what I learned about deploying Nuxt apps on Cloudflare Workers."
📕 How to use Prisma ORM with Nuxt
👉🏻 This guide explains how to set up a Nuxt application, configure Prisma Postgres using the Prisma Nuxt module, and deploy the project to Vercel for production.
📕 How to Create Dynamic OG Images in Nuxt
👉🏻 This article walks through how to create dynamic OG images in Nuxt, step-by-step.
📕 Integrating an ASP.NET Core API with a Nuxt Front End: A Step-by-Step Guide
👉🏻 This article walks you through the process of integrating an ASP.NET Core API with a Nuxt frontend.
📹 Why is Nuxt 3.16 Even Faster?
👉🏻 Learn how Nuxt 3.16 makes your app even faster, for example by using lazy hydration.
📹 Pro Nuxt Workflow: Boost Productivity with the Nuxt.js Ecosystem
👉🏻 The Nuxt ecosystem is full of tools to boost your productivity.
👉🏻 Level up your workflow by learning how take advantage of them.
🛠️ nuxt-commerce
👉🏻 A high-performance, server-rendered E-commerce app built with Nuxt & Shopify.
👉🏻 It uses Nuxt UI, image & scripts optimization, hybrid rendering, SEO and more.
📅 Events
Vueconf.US (13 - 15 May 2025, Tampa, Florida)
MadVue (29 May 2025, Madrid, Spain)
PragVue (23 September 2025, Czech Republic)
💬 Quote of the week
🧑🏻💻 In Other News
📕 JavaScript
👉🏻 There is an increasing reliance on JavaScript in web dev and its impact on performance.
👉🏻 Key findings include a rise in JavaScript volume and requests, alongside the growing use of optimization techniques like Brotli compression and dynamic imports.
📕 Learn Zod So You Can Trust Your Data and Your Types
👉🏻 Zod is a convenient TypeScript validation library.
👉🏻 This post gives you the overview of what Zod is, why you might use it, the main concepts and general pattern of usage.
🎮 Divided We Fall
👉🏻 Learn HTML and CSS with this fun browser game.
🛠️ Node Modules Inspector
👉🏻 Visualizes and allows inspection of `node_modules` directories in pnpm and npm projects.
😂 Fun
🔗 Want more Vue & Nuxt content?
More Exclusive Vue Tips : Join Michael Thiessen's newsletter and get great Vue tips and insights delivered to your inbox each
week.
Weekly Vue & Nuxt Videos : You must subscribe Alexander Lichter's YouTube channel if you are interested in Vue & Nuxt.
DejaVue Podcast : A weekly podcast about Vue.js and the ecosystem around it.
Comments? Join the discussion about this issue in our Discord community .
Until next week,