DejaVue

By Alexander Lichter & Michael ThiessenTechnology Education

DejaVue episodes

August 22, 2024Signals
It was teased in the last episode already and here it - Michael and Alex talk about the current hype in the front end development community: Signals. But if you as a Vue developer don't feel hyped around it and maybe even didn't hear much around it, fear no more - that is normal and will be explained in the episode too.
Join the two Vue experts covering the history of Signals, what's behind the term and how they work in Vue.js and other major frameworks.
And of course, the TC39 proposal to add Signals to the language itself wasn't forgotten either.
Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue
(01:06) - Signals and Reactivity
(04:41) - Functional Programming
(10:51) - Signals in Modern Frameworks
(11:48) - How Signals look like in other Frameworks
(14:20) - Signals in Vue
(15:20) - Signals vs. refs?
(17:51) - A Standard for Signals
(21:54) - Benefits of Signals in the language
(25:16) - Vue.JS DE Conf 2024
Links and Resources

$10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE

DejaVue #E022 - Reactivity in Vue
Haskell
OCaml
Elixir
Elm
Zod
Valibot
Solid.js
Building solid-like Signals in Vue with shallowRef
Vue Docs on Signals
TC39 Proposal
VueUse

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
27 min
August 15, 2024Reactivity in Vue
Join Alex and Michael on a talk about a key topic in Vue.js - the reactivity system. Before diving into how it works in Vue 3, reactivity in Vanilla JS is covered. Then, the differences between the major Vue versions are discussed, showing an astonishing evolution in terms of DX but also performance when it comes to reactivity.
Of course, the ref vs reactive topic can’t be left out, and neither can signals and vapor mode.
Sounds interesting? Then tune in!
Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue
(01:38) - What is Reactivity in general?
(03:47) - Reactivity in JavaScript?
(07:45) - Reactivity in Vue 1
(09:08) - Changes to reactivity in Vue 2
(10:47) - Reactivity system and caveats in Vue 2
(15:10) - Vue 3 Reactivity with Proxies
(19:00) - No IE11 support
(20:22) - Ref and Reactive in Vue
(25:12) - shallowRef, triggerRef and more
(28:23) - Why not shallowRef by default?
(31:24) - Vue's reactivity system as a standalone package
(34:21) - Vapor Mode
(40:52) - Wrapping Up
Links and Resources

$10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE (Release on Aug 5th)
10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE

DejaVue #E015 with Evan You
Petite Vue Talk
Debugging Guide: Why Your Vue Component Isn't Updating (and how to fix it)
Marc Backes - Building a Time Machine with Proxies
CanIUse Beowser Usage Stats
Michael Thiessen on ref vs. reactive
Alex's shallowRef guide
Alpine.js
Reactivue - Vue CAPI in React 👀
Arrow-js
Vapor Mode Repo
Vapor Mode Playground

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
43 min
August 08, 2024Documentation and Migration: From Vue 2 to Vue 3 (with Natalia Tepluhina)
For the 20th episode we surprise you with a "in-person" podcast episode!
Alex is joined by Principal Engineer and Vue Core Team Member Natalia Tepluhina to talk about two important topics - Documentation and the Migration from Vue 2 to Vue 3.
Learn in this episode what Natalia does in the core team, how difficult writing docs is and how to improve your doc writing skills. Also, gain insights in how GitLab's migration from Vue 2 to Vue 3 is going and get invaluable tips if you also have to migrate a project over!
Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue!
(01:32) - When did you start using Vue.js?
(02:42) - How could you introduce Vue at work?
(04:43) - Joining GitLab
(07:15) - Getting into public speaking
(10:05) - Memorable moments as a speaker
(16:22) - Moving to Amsterdam
(18:22) - Being part of the Vue.js Core Team
(20:27) - (Not) Documenting Vue Methods
(22:21) - $parent in Vue 2
(22:59) - AI as the new docs?
(25:00) - Regular Contributors to the Vue docs
(26:14) - Is writing docs is easy?
(31:45) - Documenting Vue 3 at release
(34:04) - Documentation as a garden
(37:00) - Separating Options and Composition API docs
(38:20) - Preferring the Options API for huge teams?
(41:49) - Inline Composables and other architectural patterns
(45:35) - Overusing Watchers
(46:57) - People - Share your thoughts and patterns!
(48:39) - Vue.js DE Conference
(49:14) - Migration from Vue 2 to Vue 3
(50:10) - How the component library blocks migration
(54:10) - Updating Unit tests during migration
(55:16) - No CAPI during migration
(57:13) - Migration of big old projects
(58:45) - Responsibility of library authors
(01:05:01) - Vue 3 Breaking changes
(01:06:31) - Will the migration ever end?
(01:07:48) - Other tips for migrating
(01:09:19) - Migrating without tests
(01:10:45) - Rewrite vs Migration?
(01:11:35) - Not migrating at all?
(01:13:54) - No CAPI during migration?
(01:15:58) - New questions with CAPI
(01:16:58) - Natalia back on stage at a conference?
(01:18:16) - What could the Vue team have done better?
(01:20:21) - Nuxt Tips Collection
(01:21:00) - Wrapping up
Links and Resources

$10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE

GitLab
DejaVue Episode with Vanessa
Options API vs Composition API
Organizing Composition API Code
Bootstrap Vue
Ilya Klymov
Bootstrap Vue Next

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
1 hr 22 min
August 01, 2024Nuxt Tips You Have To Know
Are you using Nuxt and want to hear some insights you weren't aware of? Perfect! Then this DejaVue podcast episode is what you need. Michael and Alex are going through more than five big tips around Nuxt, from features under the radar over to a big chunk of amazing benefits and why they exist, all from Michael's Nuxt Tips Collection* which releases on Aug 5th (and of course we got a discount code for you)!

In addition, further topics around the vue-based meta framework like the difference between @nuxt and @nuxtjs modules are discussed as well.
Enjoy the episode!
Chapters

(00:00) - Welcome To DejaVue
(01:49) - Tip 1 - Disable Nuxt's auto imports
(03:54) - Opinion on Auto Imports
(08:12) - Tip 2 - The .nuxtignore file
(10:06) - Tip 3 - Dedupe data fetching
(12:04) - Tip 4 - Custom keyed composables
(17:00) - Tip 5 - Utilizing Layers
(21:41) - App Config
(25:50) - Why is app.config.ts an extra file?
(28:34) - The different types of Nuxt modules
(36:24) - Why are core modules not part of the core?
(38:41) - Go and write a module!
(40:54) - Upcoming Vue.js conference
(41:34) - More Tips?
(42:55) - Wrapping Up
Links and Resources

$10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE (Release on Aug 5th)
10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE

Anthony's Explicit Import ESLint module
Alex' video about Nuxt Layers
Dave Stewart's Layers Article
Michael's Mastering Nuxt article about the different configs in Nuxt 3*
The Nuxt module list
Module Authors Guide

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
44 min
July 25, 2024Insights from the Nuxt Team Retreat
In this episode of DejaVue, Alex and Michael talk about the previous "IRL Nuxt event", which was a team meeting where most Nuxt Core Team members met in France.
Together, they discuss why they met, what happened, why there was a delicious cake and further insights from the retreat, like more breaking changes to Nitro and Nuxt, codemods and other topics.
Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue
(01:04) - A real life Nuxt team meeting?
(02:44) - Who was at the meeting?
(04:11) - A cake?
(05:54) - Activities
(09:37) - How DejaVue came to life
(10:37) - Previous Vue Podcasts
(11:57) - Vue.js Australia?
(12:20) - Meetups
(13:23) - Further activities
(14:46) - Nitro breaking changes
(16:06) - Nuxt breaking changes
(18:36) - Meeting IRL more often?
(19:44) - Wrapping up
Links and Resources

10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE

E016 - The Future of Vue.js (with Evan You)
E013 - The Road to Nuxt 4 (with Daniel Roe)
E006 - Nuxt Server Components (with Julien Huang)
Nuxt pending vs. status issue
WIP Code mod

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
21 min
July 18, 2024Tiptap and Vue.js (with Vanessa Otto)
In this episode of DejaVue, Alex and Michael are joined by Vanessa Otto, a Senior Engineer at GitLab and previously being the head of Frontend at Zavvy.
After discussing Vanessa's co-host role in the German Working Draft podcast, it all revolves around the headless editor "Tiptap" in the episode. From hearing why Vanessa chose it instead of other editors and her research around editors, Tiptaps integration with Vue and what the "headless" part of the editor adds to it, over to which use cases are ideal for Tiptap.
And yes, an example repository is included so you can convince yourself of the easiness! Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue
(00:55) - Guest Introduction
(04:00) - About the "Working Draft" podcast
(09:54) - What is Tiptap?
(12:30) - Is Tiptap framework agnostic?
(15:38) - The headless part of Tiptap
(18:38) - Customization as the biggest benefit?
(23:26) - How Tiptap content is serialized and saved
(25:25) - Maturity of Tiptap
(28:03) - Adding own blocks to Tiptap
(32:01) - Tiptap and Vue principles
(34:42) - Did the community around Tiptap grew?
(36:22) - ProseMirror as the base for Tiptap
(38:50) - Tiptap Extensions - Seamless with Vue?
(42:48) - Calling Tiptap extensions
(46:55) - Call to Action: A fun idea for a Tiptap Project?
(47:09) - Meet Vanessa and Alex in Germany this Autumn!
(48:22) - Why Vanessa chose Tiptap
(51:32) - Wrapping Up!
Links and Resources

10% discount for the vue.js de Conf in Bonn, Germany with code DEJAVUE

Working Draft Podcast (German)
Vannessa's Research/Comparison Table
Tiptap
awesome-tiptap
awesome-vue
ProseMirror
Vannessa's Example repo with TipTap and OpenAI

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
55 min
July 11, 2024The Future of Vue.js (with Evan You)
After the first part, Michael and Alex continue their conversation with the one and only Evan You, covering the future of the modern JavaScript Framework.
Starting straight with possible plans for Vue 4 to address common pain points and no ETA for the next major, exciting improvements like native CSS Scoping or removing the need for declaring props are discussed (though nothing is set on stone)!

Next, Vue 3.5 and it's current alpha version are on the list. We all look forward to the amazing features in the next minor version, including Lazy Hydration, perf improvements, easier types and also new composables like useTemplateRef.

Eventually, the State of Suspense, Vapor Mode, Volar, and Mobile App Development with Vue are addressed as well.

Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue!
(01:06) - Do you have any plans for Vue 4?
(02:47) - Ref Unwrapping in objects
(05:22) - Native CSS Scoping, Signals and Browser range
(07:12) - Defaulting to script setup and TypeScript
(11:12) - No prop declaring necessary anymore
(13:43) - Nothing set in stone for Vue 4
(14:50) - Vue 3.5 improvements
(15:50) - Internal type improvements
(16:33) - Reactive Props Destructure RFC
(19:31) - useId and useTemplateRef
(21:00) - Do we still need custom directives?
(22:06) - Lazy Hydration
(22:57) - Allowing Hydration mismatches on purpose
(25:10) - Custom Lazy Hydration Triggers
(26:18) - Vue 3.5 Alpha
(26:56) - State of Suspense
(30:17) - Vapor Mode
(33:44) - Performance of Vapor
(35:31) - Volar and the Vue VS Code Extension
(39:09) - Negativity towards Volar
(40:18) - Mobile App Development with Vue
(42:51) - What content would help the Vue community?
(51:07) - Wrapping up!
Links and Resources

10% discount for the vue.js de Conf in Bonn, Germany with code DEJAVUE
Nuxt UI Pro* - Get 20% off with code LICHTER until July 14th

Reactive Props Destructure RFC
Volar
Vue Language Tools
Nuxt
JS Framework Benchmark
Ecosystem CI (Vue)
NativeScript
TailwindCSS
Kevin Deng (sxzz)
Anthony Fu
Daniel Roe

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
52 min
July 04, 2024Ten Years of Vue (with Evan You)
This DejaVue episode is special - Alex and Michael meet up with the creator of Vue, Vite and Rolldown, Evan You himself and talk about the last ten years of Vue!
Starting with how Vue.js started as a side project while Evan still worked at Google, Evan shares the story of how Vue.js came to be and how it evolved over the years. Interesting insights, such as why the Composition API was created and which initial problems should be solved with it, are shared in this episode. And to all that, questions from the Q&A were answered as well, touching topics like petite-vue, if and how the Options API will persist and how opinionated Vue.js is.
After an hour of content and insights, the episode ends with a tiny cliffhanger, as Part Two of the conversation covering the future of Vue, possible Vue 4 features, Vapor mode, Vue 3.5 and more, will be released next week!
Enjoy the episode!
Chapters

(00:00) - Welcome to DejaVue!
(01:09) - How did Vue.js start out?
(04:48) - The Initial Version of Vue.js
(13:42) - Do new Vue users start without a build step?
(15:02) - Vue's expansion to different use cases
(18:14) - Is Petite Vue dead?
(21:03) - Why Vue 2?
(29:58) - How opinionated is Vue?
(35:15) - The Transition from Vue 2 to Vue 3
(36:32) - How did the idea for the Composition API came up?
(38:24) - Options API vs Composition API
(44:54) - Will the Options API stick around?
(46:10) - Overhead of keeping APIs around
(51:13) - Considering to disable Options API via a flag?
(53:05) - The former class-based API proposal
(58:03) - Classes with Vue's reactivity concept
(59:38) - Whaat, there is a Part 2?
Links and Resources

Meteor.js
Knockout
AngularJS
Solid
Ruby on Rails
Laravel
HTMX
Svelte
Nuxt
AlpineJS
Laravel Livewire
Inertia
John Resig
React
Ember
Babel
Axios
Justin Schroeder
TC39 Decorators proposal
vue-facing-decorator
1 hr 1 min
June 26, 2024VueUse and Our Favorite Composables
VueUse might be a library known to many Vue and Nuxt developers - and if not, it should be quickly! With over 200 functions, composables and utilities, it provides a "standard composable kit" which Alex and Michael take a look at in this DejaVue episode. And more than that, they also share their favorite composables that they use or learnt a lot from. Definitely do not miss that out and stay for the spoilers at the end.
Enjoy the episode!
Chapters
(00:00) - Welcome to DejaVue
(00:45) - An Introduction to VueUse
(01:59) - How often do you use VueUse?
(03:50) - Using a library or better to DIY?
(05:38) - The Reactivity Layer
(06:43) - Docs, Demos and Source Code
(09:52) - Composable 1 - useEventListener
(13:10) - Composable 2 and 3 - useDebounceFn & useThrottleFn
(17:46) - Composable 4 - useLocalStorage
(24:00) - Composable 5 - useMagicKeys
(29:04) - Util 6 - makeDestructurable
(33:18) - Wrapping up around VueUse
(34:43) - Nuxt Tips Collection
(35:33) - SPOILER!!!
Links and Resources

Nuxt Tips Collection from Michael
Mastering Nuxt*
VueUse
VueDemi
Slidev
is-even package
is-odd package
Composable 1 - useEventListener
Composable 2 - useDebounceFn
Composable 3 - useThrottleFn
Debounce Vs Throttle
Composable 4 - useLocalStorage
Localstorage example from Alex' Website
Composable 5 - useMagicKeys
Util 6 - makeDestructurable
Bonus - createReusableTemplate

Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.
37 min
June 20, 2024The Road to Nuxt 4 (with Daniel Roe)
Nuxt 4 is cooking for a while and is close to being released soon. An ideal time for a DejaVue episode where Michael and Alex we explore the upcoming major version of the metaframework with the lead of the Nuxt team, Daniel Roe.
After introducing Daniel, we jump into the power of small changes and how Daniel explains his day job to people. We then dive into why Nuxt 4 is being necessary "now", its top priorities, and how to ease any fears about upgrading (don't worry folks!). Eventually, new Nuxt 4 changes and even features, like the improved folder structure will be discussed. As a bonus, Daniel reveals how he got into programming and that we was a real hacker-man early on.
And of course, Daniel reveals when Nuxt 4 will be released in the final minutes, as well as his upcoming Nuxt for React Devs course.
Enjoy the episode!
Chapters

(00:00) - Getting Started and Guest Introduction
(02:43) - How do you Describe your Day Job?
(04:33) - The Power of Small Changes
(11:50) - April Fools Joke
(13:02) - Why Nuxt 4 Now?
(19:00) - The Top Priority for Nuxt 4
(20:54) - How to reduce the Fear of Nuxt 4?
(27:48) - Codemods for Nuxt 4
(29:41) - Experiencing Nuxt 4 Migrations
(32:02) - New Folder Structure
(34:06) - Exciting New Nuxt 4 Features
(36:46) - Compatibility Date
(44:26) - How did you get into Programming?
(48:44) - Daniel's Contact with the Vue World
(52:38) - University Degrees
(59:42) - Joining the Core Team
(01:04:28) - How Daniel is Funding
(01:08:56) - The Freedom of Doing the Things You Enjoy
(01:12:45) - When will Nuxt 4 be released?
(01:15:20) - Interesting Projects and Courses of Daniel
(01:17:25) - Wrapping Up
Links and Resources

Daniels April Fools Joke (on Twitter)
Nuxt 4 Migration Guide
How to Migrate to Nuxt 4 now!
How Daniel is Funded
Daniel's React to Nuxt Course
1 hr 19 min

About DejaVue

From the publisher's feed

Welcome to DejaVue, the Vue podcast you didn't know you needed until now! Join Michael Thiessen and Alexander Lichter on a thrilling journey through the world of Vue and Nuxt.