Hi 👋
VueConf Toronto is happening this week, and I'm wishing everyone attending an amazing time filled with inspiration and new insights!
For this issue, I'm sharing a quick tip on using snippets in VS Code to help speed up your development workflow. Hope it comes in handy!
Enjoy this issue and have a lovely week ☀️
Vue
📕 7 Beautiful Next-Level Button Components with Vue, VueUse, and TailwindCSS*
👉🏻 This article demonstrates 7 different button designs that are both practical and look great.
👉🏻 Learn how you can implement them with Vue, VueUse, TailwindCSS.
📹 DejaVue #E033 - Vue or React (with CJ Reynolds)
👉🏻 Alex and CJ Reynolds talk about Vue and React in this episode of DejaVue.
👉🏻 The two content creators also talk about CJ 's career path.
📹 Vue Architecture for Scalability: Introduction to Layered Design
👉🏻 This introductory video reviews managing complexity in Vue applications using a layered architecture approach.
🛠️ NumberFlow
👉🏻 A component to transition, format, and localize numbers.
👉🏻 Dependency-free. Accessible. Customizable.
👉🏻 Available for Vue, React and Svelte.
🛠️ Urocissa
👉🏻 A self-hosted gallery designed to serve massive collections, capable of handling millions of images and videos.
👉🏻 It is built using Rust and Vue.
💡 Vue Tip: Speed Up Vue 3 Development With VS Code Snippets
If you are using VS Code as a code editor for Vue & Nuxt app development, I highly suggest using one of the available code snippet extensions.
I'm personally using Vue 3 VS Code Snippets .
My most used snippet is vbase-ns
vbase-ns which creates a base Vue 3 file with script setup
script setup with TypeScript at the top of the file and no style block.
It provides many more useful snippets, for example vfor
vfor inside the template tag to create a v-for
v-for statement or vwatch
vwatch inside the script tag to create a watcher.
The following image shows the extension in action:
Nuxt
📕 Nuxt Going Full-Stack: How to Handle Authorization?
👉🏻 This article aims to assist you in managing authorization within your Nuxt application, thereby preventing and restricting unauthorized access to your data.
📕 Using Cache Control in Nuxt to improve Performance
👉🏻 This article introduces you to the topic of Cache Control header in Nuxt so that you can instruct the browser how it should cache certain pages to improve performance.
📕 Controlling When Components are Loaded in Nuxt*
👉🏻 Explore how to optimize your Nuxt app's performance by controlling when components load.
👉🏻 Learn about lazy components, prefetching, and making components asynchronous to enhance user experience and reduce initial load times.
📹 Create a site with Vue.js, Nuxt Studio, Nuxt Content, and Nuxt UI
👉🏻 Ferdinand and Baptiste from Nuxt Labs explore the latest updates in the Nuxt ecosystem.
👉🏻 Ferdinand kicks off with an introduction to Nuxt Labs.
👉🏻 Baptiste takes over with a live demo, showcasing how to create a website from scratch using Nuxt Studio.
📅 Events
VueConf Toronto (18 - 20 November 2024, Toronto, Canada)
Vuejs Amsterdam (12 - 13 March 2025, Amsterdam, Netherlands)
💬 Quote of the week
🧑🏻💻 In Other News
📕 How to roll your own auth in JavaScript & TypeScript
👉🏻 Rolling your own session-based auth in JS/TS is useful for understanding core web authentication concepts.
👉🏻This article goes over cookie management, password hashing using Argon2, and framework-agnostic examples for sign up, sign in, and sign out functions.
📕The Testing Pyramid is Dead. Draw Your Own Shape Instead
👉🏻 Lean why the testing pyramid has become less useful over time, and why we should all just draw our own shapes anyway.
📕 JavaScript's ??= Operator: Default Values Made Simple
👉🏻 A guide to using ??= in JavaScript to handle null and undefined values elegantly.
🛠️ Browser-Use
👉🏻 An open-source web automation library that allows users to interact with websites using any language model through a simple interface.
😂 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,