DejaVue

👉 Don't forget to join ViteConf on October 9-10 in Amsterdam [https://viteconf.amsterdam/] In this episode of DejaVue, Michael and Alexander look into the major release of Vite 7, including the move to ESM-only, dropping Node 18 support, and adopting the Baseline browser target. They also discuss the evolving Environment API, upcoming changes in Rolldown-Vite, new Vite dev tools, and more. Enjoy the Episode! Chapters * (00:00) - Welcome to DejaVue * (00:48) - Vite 7 without breaking changes * (01:53) - Node Version dropped * (03:13) - ESM-only and Module Formats * (09:04) - What does ECMA and GIF mean? * (10:51) - Browser target to Baseline Wide Available * (14:31) - Environment API * (16:14) - Rolldown-Vite * (17:39) - Cleaning up APIs * (18:11) - Vite Dev Tools * (21:41) - ViteConf * (22:57) - Vite Plugin Vue Beta * (25:04) - Wrapping Up Links and Resources * Vite Announcement post [https://vite.dev/blog/announcing-vite7.html] * require(esm) in Node [https://joyeecheung.github.io/blog/2024/03/18/require-esm-in-node-js/] * tsdown [https://tsdown.dev/] * obuild [https://github.com/unjs/obuild] * fdir PR [https://github.com/thecodrr/fdir/pull/147] * DejaVue #E058 - The History of Nuxt and NuxtLabs (with Sébastien Chopin) [https://share.transistor.fm/s/aa3553d0] * DejaVue #E051 - Vite Inside Out (with Matias "Patak" Capeletto) [https://share.transistor.fm/s/528e34ed] * Vite DevTools Preview (screenshot) [https://x.com/voidzerodev/status/1916513666939211942] * Vite Plugin Vue 6.0 (not beta anymore) [https://github.com/vitejs/vite-plugin-vue/releases/tag/plugin-vue%406.0.0] Your Hosts Alexander Lichter * Bluesky [https://bsky.app/profile/thealexlichter.com] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://www.lichter.io/] Michael Thiessen * Twitter [https://twitter.com/MichaelThiessen] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://michaelnthiessen.com/] --- 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.

Big news in the Nuxt ecosystem. While you out there already know what has been announced - some of us didn't. Luckily, Daniel Roe, Head of the Nuxt team joins this DejaVue episode and discusses the highly anticipated "double trouble": Not one, but two major versions for Nuxt are on the horizon. After over a year of delays, Daniel reveals the strategic decision to release Nuxt 4 in less than a month from now, followed by Nuxt 5 which will include the long-awaited Nitro 3 integration and significant Vite improvements. The episode covers the smooth migration experience early adopters reported already, the philosophy behind careful breaking changes, and how the team plans to maintain a yearly major release cycle moving forward. Enjoy the Episode! Our Guest Daniel Roe * Bluesky [https://bsky.app/profile/danielroe.dev] * Web [https://roe.dev/] * YouTube [https://www.youtube.com/@danielroe/] * Twitch [https://www.twitch.tv/danielroe] Chapters * (00:00) - Welcome to DejaVue * (01:19) - The big topic * (02:41) - What are the release plans? * (06:47) - Two major versions soon? * (09:28) - Early adopters of compatibilityVersion 4 * (11:56) - Depending on other dependencies and versions bumps * (13:45) - Is bumping the minimum Node version a breaking change? * (16:33) - A Quick Nitro TL;DR * (20:46) - Nitro in other frameworks * (25:20) - Why Nuxt 4 now? * (28:41) - LTS support Plans * (29:53) - Nuxt Bridge * (31:46) - Release Dates and skipping Nuxt 4 altogether * (33:14) - We need Release names! * (35:53) - Release Dates for Nuxt 4 and 5 * (40:00) - Wrapping Up Links and Resources * Roadmap to v4 blog post [https://nuxt.com/blog/roadmap-v4] * DejaVue #E043 - The Year in ReVue (with Daniel Roe) [https://share.transistor.fm/s/2dd8fbad] * DejaVue #E044 - Our Predictions for Vue and Nuxt in 2025 (with Daniel Roe) [https://share.transistor.fm/s/3c5bc972] * DejaVue #E013 - The Road to Nuxt 4 (with Daniel Roe) [https://share.transistor.fm/s/caa4a6a4] * Daniel's PR migrating Elk [https://github.com/elk-zone/elk/pull/3298] * Nuxt 4 Migration Guide [https://nuxt.com/docs/getting-started/upgrade#migrating-to-nuxt-4] * DejaVue #E003 - Nitro: The Next Generation Server Toolkit [https://share.transistor.fm/s/d7130ed5] * Srvx [https://srvx.h3.dev/] * Michael's Nuxt Release Date Comic [https://bsky.app/profile/michaelthiessen.bsky.social/post/3llcjnkygys2o] * Alex' Nuxt 4/5 video [https://www.youtube.com/watch?v=TAoTh4DqH6A] Your Hosts Alexander Lichter * Bluesky [https://bsky.app/profile/thealexlichter.com] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://www.lichter.io/] Michael Thiessen * Twitter [https://twitter.com/MichaelThiessen] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://michaelnthiessen.com/] --- 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.

Join Alex and Michael with special guest Sébastien Chopin, creator of Nuxt.js and CEO of NuxtLabs, to learn more about the origins and evolution of the Vue-based meta framework. Sébastien shares valuable lessons from open source, how he came to create Nuxt.js in the first place and which challenges came with it. In the second part of the episode, they cover Sébastien's company NuxtLabs - from its inception over to taking Venture Capital and products, such as NuxtHub or Nuxt UI Pro. Eventually, the NuxtLabs CEO also outlines how they handle sponsorships of maintainers, and what the future holds for Nuxt and NuxtLabs. Enjoy the Episode! Our Guest Sébastien Chopin * NuxtLabs [https://nuxtlabs.com/] * Nuxt [https://nuxt.com/] * Personal Website [https://atinux.com] * Bluesky [https://bsky.app/profile/atinux.com/] Chapters * (00:00) - Welcome to DejaVue * (01:16) - How did you get into programming? * (04:45) - The birth of Nuxt.js * (07:43) - The Elevator Pitch for Nuxt * (10:16) - When not to use Nuxt * (11:20) - Nuxt as Multi Bundler Framework * (12:37) - How does Nuxt scale (in Enterprise)? * (16:04) - Lessons Learned from building Nuxt * (19:47) - How to compare frameworks fairly? * (23:20) - Frameworks converging * (24:22) - Nuxt.js supporting React? * (29:06) - The creation of NuxtLabs * (33:50) - Products of NuxtLabs * (37:11) - Why going all in on Cloudflare for NuxtHub * (41:50) - Vite Environment API * (45:34) - The difference between Nuxt and NuxtLabs * (51:56) - Is Nuxt a VC-backed framework? * (53:51) - Sponsoring Core Maintainers * (56:07) - Freemium in Nuxt * (57:06) - Sneak Peek of the NuxtLabs Roadmap * (59:51) - Where can people find you? Links and Resources * Nuxt [https://nuxt.com/] * Intro to Nuxt Layers [https://www.youtube.com/watch?v=fr5yo3aVkfA] * Nitro [https://nitro.build/] * Reactivue [https://github.com/antfu/reactivue] * inclusion-vapor [https://github.com/kazupon/inclusion-vapor] * DejaVue #E044 - Our Predictions for Vue and Nuxt in 2025 (with Daniel Roe) [https://share.transistor.fm/s/3c5bc972] * Volta [https://volta.net/] * Nuxt UI [https://dejavue.fm/nuxt-ui] * * Nuxt Governance [https://github.com/nuxt/governance] * Nuxt Studio [https://nuxt.studio/] * NuxtHub [https://hub.nuxt.com/] * Laravel Vapor [https://vapor.laravel.com/] * Cloudflare [https://cloudflare.com/] * DejaVue #E051 - Vite Inside Out (with Matias "Patak" Capeletto) [https://share.transistor.fm/s/528e34ed] * Strapi [https://strapi.io/] Your Hosts Michael Thiessen * Twitter [https://twitter.com/MichaelThiessen] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://michaelnthiessen.com/] Alexander Lichter * Bluesky [https://bsky.app/profile/thealexlichter.com] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://www.lichter.io/] --- 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.

In this episode of DejaVue, Michael and Alex chat with Matt Perry, the creator of Motion (formerly Framer Motion), about animations in web development. Matt talks about his journey from designing gaming magazines as a kid to becoming a full-time developer, sharing his experiences with ActionScript, jQuery, and how Motion was born. They discuss how simple and powerful Motion's API is, its ability to work with different frameworks, and how it stacks up against other animation libraries like GSAP and AnimeJS. But the episode also covers a lot of open source aspects, such as the challenges of keeping Motion going!  Matt explains how Motion+ funds the development of Motion with one-time payments and time-gated (then publicly available) content, to support the project. Enjoy the episode! Our Guest Matt Perry * Motion [https://motion.dev/] * Personal Website [https://citizenofnowhe.re/] * Bluesky [https://bsky.app/profile/did:plc:jqvil2la5t4yccau2abpmj6t] * Twitter [https://x.com/mattgperry] Chapters * (00:00) - Welcome to DejaVue * (01:20) - How did you get into programming? * (05:18) - Adobe ActionScript * (08:33) - What is Motion (fka. Framer Motion)? * (12:21) - APIs and Limitations * (16:54) - Prerequisites for using Tools * (24:26) - The jQuery of web animations * (26:37) - The birth of Motion * (31:02) - Motion for Vue * (32:40) - Other "Motion for ..." adaptations? * (34:36) - Funding the project - Motion+ * (40:00) - One-time Payment and Time-gating * (50:39) - Thoughts on other ways of monetizing Motion * (52:43) - Can AI replace animation libraries? * (57:41) - The difference between Motion and other libraries * (01:01:04) - Closing Thoughts Links and Resources * ActionScript [https://en.wikipedia.org/wiki/ActionScript] * ECMAScript [https://en.wikipedia.org/wiki/ECMAScript] * Popmotion [https://popmotion.io/] * Motion [https://motion.dev/] * Motion Vue [https://github.com/motiondivision/motion-vue] * Rick (Motion Vue maintainer) [https://x.com/hp0844182] * Framer [https://www.framer.com/] * DejaVue #054 - Open Source Sustainability (with Daniel Roe, Chad Whitacre & Rijk van Zanten) [https://share.transistor.fm/s/964b5bb9] * GSAP [https://gsap.com/] * AnimeJS [https://animejs.com/] Your Hosts Michael Thiessen * Twitter [https://twitter.com/MichaelThiessen] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://michaelnthiessen.com/] Alexander Lichter * Bluesky [https://bsky.app/profile/thealexlichter.com] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://www.lichter.io/] --- 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.

In this episode of DejaVue, Alex and Michael are joined by Jared Wilcurt, UI architect and open source contributor, to get knee-deep into the world of testing in Vue.js, especially Snapshot Testing. Jared shares his journey from React frustration to Vue enthusiasm, and explains how he identified gaps in Vue's testing ecosystem that led to the creation of his Vue 3 Snapshot Serializer library. No matter if you are a testing novice, wondering why you should bother with tests at all, or an experienced developer looking to improve your snapshot testing workflow, this episode got something for you - from reducing test noise, improving readability, and gaining confidence in your Vue applications and components. Discover how snapshot testing complements traditional assertion-based tests and why it might be the missing piece in your testing strategy. Enjoy the episode! Our Guest The Jared Wilcurt * Vue 3 Snapshot Serializer [https://github.com/tjw-lint/vue3-snapshot-serializer] * Website [https://thejaredwilcurt.com/] * Bluesky [https://bsky.app/profile/thejaredwilcurt.bsky.social] * Twitter [https://x.com/TheJaredWilcurt] Chapters * (00:00) - Welcome to DejaVue * (00:20) - How did you get into Programming? * (05:20) - Learning Vue * (09:46) - Finding gaps in the ecosystem * (12:40) - What is unit testing? * (21:40) - Testing in the frontend * (25:31) - Snapshot Testing * (29:45) - Snapshot Updating Fatigue * (36:09) - Responsibilities & ROI of a Snapshot Test * (42:46) - Using the Snapshot Serializer * (46:40) - Snapshot vs. Visual Regression Testing * (52:57) - A good tip from Daniel Roe * (53:50) - Further Noise Reduction * (01:01:22) - A tighter integration? * (01:05:11) - Wrapping up Links and Resources * Riot JS [https://riot.js.org/] * Vue Indy Meetup [https://www.meetup.com/vuejsindy/] * Vue Doxen [https://github.com/TheJaredWilcurt/vue-doxen] * Old Jest Snapshot Serializer [https://github.com/eddyerburgh/jest-serializer-vue] * Vue Test Utils [https://github.com/vuejs/test-utils/] * Testing Library Vue [https://github.com/testing-library/vue-testing-library] * Playwright [https://playwright.dev/] * Vue 3 Snapshot Serializer [https://github.com/tjw-lint/vue3-snapshot-serializer] * DejaVue #E043 - The Year in ReVue (with Daniel Roe) [https://share.transistor.fm/s/2dd8fbad] Your Hosts Michael Thiessen * Twitter [https://twitter.com/MichaelThiessen] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://michaelnthiessen.com/] Alexander Lichter * Bluesky [https://bsky.app/profile/thealexlichter.com] * YouTube [https://www.youtube.com/@michaelnthiessen] * Website [https://www.lichter.io/] --- 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.