Weekly Vue.js News

By Michael Hoffmann (Mokkapps)

Hi 👋 My name is Michael Hoffmann and I'm a Senior Frontend Developer, Freelancer and Blogger. I focus on Vue.js, JavaScript, TypeScript and Spring Boot. Occasionally I also give career & freelancer advice. My weekly emails reflect this preference.

Hi 👋

My name is Michael Hoffmann and I'm a Senior Frontend Developer, Freelancer and Blogger.

I focus on Vue.js, JavaScript, TypeScript and Spring Boot. Occasionally I also give career & freelancer advice.

My weekly emails reflect this preference.

By subscribing, you agree with Revue’s Terms of Service and Privacy Policy and understand that Weekly Vue.js News will receive your email address.

230

subscribers

47

issues

#47・

Weekly Vue.js News - #47 - Understand the difference between the watch() and watchEffect() hook

We can use the watch() hook to trigger a callback whenever a piece of reactive state changes. It also enables us to access the previous value of the watched variables.

 
#46・

Weekly Vue.js News - #46 - Use fallthrough attributes

A "fallthrough attribute" is an attribute or v-on event listener that is passed to a component, but is not explicitly declared in the receiving component's props or emits. Common examples of this include class, style, and id attributes.For example, given a &l…

 
#45・

Weekly Vue.js News - #45 - Provide fallback content for slots

There are cases when it's useful to specify fallback (i.e. default) content for a slot, to be rendered only when no content is provided. A typical use case is a slot inside a <button> where we define a fallback if no text content is provided.

 
#44・

Weekly Vue.js News - #44 - Debug Computed Properties

We can debug computed properties by passing computed() a second options object with onTrack and onTrigger callbacks:onTrack will be called when a reactive property or ref is tracked as a dependency.onTrigger will be called when the watcher callback is trigger…

 
#43・

Weekly Vue.js News - #43 - Update v-model after change events

By default. the v-model syncs with the state of the Vue instance on every input event. The .lazy modifiert changes the v-model to only sync after change events.

 
#42・

Weekly Vue.js News - #42 - Create custom v-model modifier

v-model has some built-in modifiers like .lazy, .number and .trim. But in some cases, you might need to add your own custom modifier.In this simple demo, I want to create a custom modifier called no-underscore that removes all underscores _ from an input:

 
#41・

Weekly Vue.js News - #41 - Define component name with <script setup>

If you are using the new &lt;script setup&gt; syntax, you may run into a case where you need some Options API functionality.In this case, it's possible to add an additional &lt;script&gt; block to your component. Vue will mix the two together for you, so the …

 
#40・

Weekly Vue.js News - #40 - Transition on appear

Hi 👋This week you will learn how to apply a transition to a Vue component on it's initial render. Additionally, I got my first viral tweet on Twitter &amp; Linked that reached more than 15k people 😮If you enjoyed this issue, show your support by sharing this …

 
#39・

Weekly Vue.js News - #39 - Query inner elements in third-party components

Hi 👋Last week I wrote a new blog post about the Chrome Recorder. Additionally you will learn in this issue, how to query inner elements in 3rd party Vue components and much more.Have a great week ☀️

 
#38・

Weekly Vue.js News - #38 - Skip compilation for an element and all its children

Hi 👋Finally, Nuxt 3 Release Candidate 1 was released last week. Have a great week ☀️

 
#37・

Weekly Vue.js News - #37 - Check Vue version at runtime

Hi 👋I'm finally negative for COVID-19 😃 Besides my full-time freelance project I started to design version 3 of my portfolio website in Figma. I will develop the website with Nuxt 3.In this issue, I have curated a few interesting articles and tweets to help y…

 
#36・

Weekly Vue.js News - #36

Hi 👋Last week I got COVID but I am doing well according to the circumstances😔In this issue, I have curated a few interesting articles and tweets to help you in your journey to become a Vue expert.I hope you will enjoy this weeks’ issue and if you have any fee…

 
#35・

Weekly Vue.js News - #35

Hi 👋In this issue, I have curated a few interesting articles and tweets to help you in your journey to become a Vue expert.I hope you will enjoy this weeks’ issue and if you have any feedback, please get in touch with me on Twitter - @mokkapps or via email: m…

 
#34・

Weekly Vue.js News - #34

Hi 👋In this issue, I have curated a few interesting articles and tweets to help you in your journey to become a Vue expert.I hope you will enjoy this weeks’ issue and if you have any feedback, please get in touch with me on Twitter - @mokkapps or via email: m…

 
#33・

Weekly Vue.js News - #33

Hi 👋Last week I only worked on my freelance Vue projects but I started to collect ideas for a deep-dive article about Vue 3 Reactivity.In this issue, I have curated a few interesting articles and tweets to help you in your journey to become a Vue expert.I hop…

 
#32・

Weekly Vue.js News - #32

Hi 👋Unfortunately, we still have war in Europe 😥Last week, I did not work on any side projects or blog posts...Anyways, have a great week ☀️

 
#31・

Weekly Vue.js News -#31

Hi 👋Last week, Putin brought war to Europe 😥 Me and my fiancée prepared our emergency backpacks.... Just to be prepared for anything that can happen....Anyways, try to have a great week ☀️

 
#30・

Weekly Vue.js News - #30

Hi 👋Last week I replaced Jest by vitest in my current Vue 3 project.The migration was super smooth and happened in less than 1 hour.Why did we migrate? We couldn't run the Jest tests in Jenkins as our vue-cli version was too old and updating to the latest v5 …

 
#29・

Weekly Vue.js News - #29

Hi 👋Last week I published v2.0.0 of my Scrum Daily Standup Picker written in Vue 3, Pinia and Electron.Additionally, I am working on a new blog post about developing Electron desktop applications with Vue 3, Pinia and Electron using the Quasar framework.Have …

 
#28・

Weekly Vue.js News - #28

Hi 👋Last week I continued working on my current side project:A new version of the Scrum Daily Standup Picker Electron application based on Vue 3 + Vite + Pinia and Quasar which was initially written in Angular. I didn't expect it to be that much work but it w…