Hi 👋
This issue is packed with some really interesting articles, videos, and tools all about Vue and Nuxt. Plus, there's a Nuxt tip on reactive configurations that might be a game-changer for some of you. Dive in and enjoy!
Have a lovely week ☀️
Vue 👉🏻 Web frameworks often use a virtual DOM to keep track of current UI elements.
👉🏻 To combat performance issues, Vue.js closely couples its runtime and compiler.
👉🏻 This guide walks through setting up a Vue.js project, integrating Socket.io for WebSocket communication, and creating a real-time chat application.
👉🏻 Learn how you can use Kitbag Router in Vue to fetch your async data with route params and provide that down to your components.
👉🏻 In this video, you'll learn how to handle async state, effects and create custom hooks in both Vue and React.
👉🏻 An AI form builder to speed up the development of the forms in your Vue.js projects.
👉🏻 Generate from a prompt, image, or text attachment.
Nuxt 👉🏻 Islands and head metadata
👉🏻 Custom prefetch triggers
👉🏻 Better server source maps
👉🏻 New features for module authors
👉🏻 Nuxt Scripts provides better performance, privacy, security, and developer experience for third-party scripts.
👉🏻 Run machine learning models, such as LLMs in your Nuxt application, with minimal setup.
👉🏻 This article will explore how to generate static sites using Nuxt.
👉🏻 It provides detailed insights into controlling various behaviors and configuration options during the generation process.
👉🏻 Matt explains, why he loves to build & deploy apps with NuxtHub.
👉🏻 In this video, Alexander tries to get three different backend frameworks up and running with Nuxt.
💡 Nuxt Tip: Reactive Configuration You can use the app.config.ts file in Nuxt 3+ to expose a reactive configuration, which you can update at runtime:
1 export default defineAppConfig ({ 2 theme : ' dark ' , 3 version : 1 , 4 }); As these values are exposed to the client bundle, you should not put any secret values inside this file.
In your app, use the useAppConfig composable to access the configuration values:
1 < script setup lang = " ts " > 2 const appConfig = useAppConfig (); 3 4 console . log ( ' Theme: ' , appConfig . theme ); 5 console . log ( ' Version: ' , appConfig . version ); 6 </ script > You can try out this example on StackBlitz where I simulate a network request that updates the config after a timeout of 3 seconds:
📅 Events 💬 Quote of the week 🧑🏻💻 In Other News 👉🏻 An explainer for doing web development using only vanilla techniques.
👉🏻 This means no tools and no frameworks — just HTML, CSS, and JavaScript.
👉🏻 This article goes through the process of building a website for tracking supermarket prices in Greece.
👉🏻 The main challenge was scraping JavaScript-heavy websites, which was solved using Playwright.
👉🏻 A web component for selecting emojis, with support for Emoji v15.1 and custom emoji.
👉🏻 It has a small bundle size and efficient memory usage thanks to IndexedDB.
👉🏻 A web-based CSS editor with a GUI.
😂 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.
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,
To support me:
😘 Recommend the newsletter to your friends: it really helps!
💸 Sponsor this newsletter
🧵 Repost the latest X thread
📨 Reply to this email: feedback is welcome
* Some of my links are affiliate links; if you make a purchase, I gain a small percentage at no extra cost. Thank you for supporting my newsletter.
评论
发表评论