Don't miss the next edition. Subscribe to the newsletter.
Published at Mar 10, 2025, 3:00 PMDocument Your Nuxt Endpoints With OpenAPI and Visualize With Swagger or Scalar Ready for your weekly Vue & Nuxt dose? Weekly Vue News #188 Document Your Nuxt Endpoints With OpenAPI and Visualize With Swagger or Scalar View online Hi 👋 This week, I’ve got a useful Nuxt tip on documenting your Nuxt endpoints with OpenAPI and visualizing them using Swagger or Scalar. Besides that, I’m still working on integrating Polar into my upcoming Nuxt SaaS starter kit, though my free time for such side projects is limited. Enjoy this issue and have a lovely week ☀️ Vue 📕 Understanding Vue’s Virtual DOM 👉🏻 In this article, you'll explore how Vue’s Virtual DOM works can help optimize your applications and write more efficient code. 📹 3 (and a half) Pinia problems you should avoid 👉🏻 Pinia is integral for a lot of applications. 👉🏻 But make sure that you don't make the mistakes shown in the video, or if you do, how to fix them. 🛠️ PrimeVue 4.3 👉🏻 A UI component suite for Vue, now with a new 'theme designer' tool including a Figma-to-code feature. 🛠️ Vue Multiselect 👉🏻 Single / multiple select 👉🏻 Server-side Rendering (SSR) support 👉🏻 Vue 3 Compatible 👉🏻 Fully configurable 👉🏻 No dependencies Nuxt 📕 When to Use $fetch, useFetch, or useAsyncData in Nuxt: A Comprehensive Guide* 👉🏻 Confused about when to use $fetch, useFetch, or useAsyncData in Nuxt? 👉🏻 This guide breaks down their differences, best use cases, and common pitfalls to help you make the right choice for your project. 📕 Automatically Deploy Your Nuxt Static Site to DigitalOcean with GitHub Actions 👉🏻 Auto-deploy is one of the great features of Netlify and Vercel. Whenever you push to a branch your site builds & deploys automatically. 👉🏻 The author of this article loves that, but prefers to manage his own server. 📹 2025 Comprehensive Nuxt Tutorial 👉🏻 In this in 5 hour depth course you build a dark, modern, animated website with Nuxt, GSAP, Prismic, Tailwind, and TypeScript. 🛠️ Nuxt UI extension for Raycast 👉🏻 Instant theme access - just a shortcut away 👉🏻 Talk to Nuxt UI in natural language 👉🏻 Support for v2 & v3 🛠️ Nuxt UI & Nuxt UI Pro v3.0.0-beta is now live 👉🏻 Vue support into Pro 👉🏻 Tailwind CSS v4.0.9 👉🏻 New Tree component 👉🏻 New useOverlay composable 👉🏻 Devtools Integration with compodium 🛠️ nuxt-feature-flags 👉🏻 A powerful, type-safe feature flag module for Nuxt 3 that enables both static and dynamic feature flag evaluation with server-side support. 👉🏻 Perfect for A/B testing, gradual rollouts, and feature management. 💡 Nuxt Tip: Document Your Nuxt Endpoints With OpenAPI and Visualize With Swagger or Scalar When you're building an API with Nuxt 3+, it's essential to have clear and accessible documentation. OpenAPI provides a structured way to describe your API, and tools like Swagger UI or Scalar make it easy to visualize and interact with your endpoints. To enable OpenAPI in your Nuxt 3 project, you need to enable the experimental Nitro feature. You can do this by adding the following configuration to your nuxt.config.ts nuxt.config.ts file: 1 export default defineNuxtConfig ({ 2 nitro : { 3 experimental : { 4 openAPI : true , 5 }, 6 }, 7 }) If you now start your Nuxt app locally, you can access the OpenAPI documentation at http://localhost:3000/_swagger http://localhost:3000/_swagger or http://localhost:3000/_scalar http://localhost:3000/_scalar : http://localhost:3000/_scalar http://localhost:3000/_scalar : Visit the official Nitro documentation for further customization options. 📗 Read the whole article 📅 Events Vuejs Amsterdam (12 - 13 March 2025, Amsterdam, Netherlands) Vueconf.US (13 - 15 May 2025, Tampa, Florida) MadVue (29 May 2025, Madrid, Spain) 💬 Quote of the week 🧑🏻💻 In Other News 📕 Extreme Server Side Rendering 👉🏻 Extreme Server Side Rendering (XSSR) is a technique where the server continuously streams HTML updates to the client, creating dynamic web pages without JavaScript. 📕 Boost Your Website Speed 👉🏻 A slow-loading website can hurt user experience, reduce search engine rankings, and decrease conversions. 🛠️ Mastra 👉🏻 A TypeScript framework for building AI apps that provides tools for workflows, agents, RAG, integrations, and evals. 👉🏻 It has a unified interface for interacting with various LLM providers. 📹 TypeScript types can run DOOM 👉🏻 A dude got the Doom engine running purely in TypeScript types. 👉🏻 The code is available on GitHub. 😂 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, Michael Hoffmann (Curator) To support me: 😘 Recommend the newsletter to your friends: it really helps! 💸 Sponsor this newsletter 🦋 Repost the latest BlueSky post 📨 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. Unsubscribe Holzapfelkreuther Str. 19, 81375 Munich, Germany {{ TrackView }}