# Portless HTTPS setups, collaborative Nuxt editors, and Vue directives… Canonical: https://brew.new/templates/vueschool/portless-https-setups-collaborative-nuxt-editors-and-vue-directives Brand: vueschool.io Category: newsletter ![Preview of Portless HTTPS setups, collaborative Nuxt editors, and Vue directives…](https://cdn.brew.new/email-preview-d33db90acf1b8e68-tracking_r57w52nyhfkdxdg2dbx0f5fg798dty0y-1789071800938.png) ## Email content Vue School website Hi John, This week’s edition is all about modern frontend workflows, from cleaner local Vue environments and collaborative Nuxt apps to practical AI integrations and production-ready UI patterns. We’re covering Portless HTTPS development, collaborative editing with Nuxt UI and Jazz, a brand-new Vue directives cheatsheet, fresh Frontend Nation workshops, and recommended next courses based on your Vue experience level. Here’s what’s inside this week: Here’s what’s inside this week: 2 new tutorials New Vue Directives Cheatsheet Frontend Nation 2026 live workshop announcements Recommended courses based on your current Vue level Practical Vue tip from Daniel Kelly Updates from the broader BitterBrains ecosystem Latest courses, articles and tutorials Portless HTTPS Hosting for Vue Dev Servers → Read the article Local Vue development usually means juggling localhost ports and remembering which app runs where. This article shows how to simplify that workflow with Portless and stable HTTPS domains for your Vue and Nuxt apps. You’ll learn how to create semantic .localhost URLs with HTTPS and HTTP/2 support, while keeping your normal Vite or Nuxt development workflow fully intact. Inside the tutorial, you’ll learn how to: create named local HTTPS domains run Portless with Vite and Nuxt use subdomains for related projects and APIs work with git worktrees and preview URLs configure custom local TLDs improve local environments for AI-assisted workflows It’s a practical guide for developers who want cleaner local development setups that feel much closer to production. → Read the article Vibe Coding a Collaborative Editor with Comment Support with Nuxt UI and Jazz → Read the article Collaborative editing is one of those features that feels complicated until you break it into the right pieces. This article explores how to build a real-time collaborative editor in Nuxt using Nuxt UI, Jazz, and AI-assisted development workflows. You’ll follow the full process behind building shared editing, comments, syncing, and collaboration features, along with practical lessons learned while working with AI agents during development. Inside the tutorial, you’ll learn how to: build a collaborative rich text editor with Nuxt UI sync real-time document changes with Jazz add comments, replies, and resolved states handle image uploads and editor layouts structure reusable Vue composables around external APIs work more effectively with AI coding agents It’s a strong behind-the-scenes walkthrough for developers exploring collaborative apps, modern Vue tooling, and practical AI-assisted workflows. → Read the article New Vue Directives Cheatsheet Download our 2-page quick reference covering the Vue directives developers actually use in production applications, including bindings, conditionals, events, forms, slots, transitions, and directive modifiers. → Get the Cheatsheet ⭐ Course recommendation RAG with Nuxt and Gemini File Search 13 lessons · 54 minutes RAG is everywhere right now, but most explanations either overcomplicate it or skip the practical parts. This course keeps things hands-on and approachable by showing how to build a complete RAG backend in Nuxt using Gemini File Search. You’ll learn how document indexing works, how to ask questions against your own files, how to stream grounded AI responses, and how to manage long-running indexing jobs with polling and background processing. A great introduction if you want to understand modern AI workflows without getting buried in infrastructure details. → Start course Upcoming events Frontend Nation 2026: Live workshops Frontend Nation isn’t only about watching talks. It’s a free, premium-quality online event built for people who want to ship better frontend systems in 2026. Alongside talks and panels, you can join live workshops during the conference, learn the patterns, and leave with something real you built. 📍 Online | 🗓️ June 3–4, 2026 → Join the conference One-click sign-up enabled Workshop 1: Generative UI - Building Apps That Compose Themselves (Alex Garrett-Smith) Workshop 1: Generative UI - Building Apps That Compose Themselves (Alex Garrett-Smith) Frontend Nation’s first official workshop tackles one of the biggest shifts in frontend right now: Generative UI, apps that orchestrate tools and compose interfaces dynamically based on intent and context. Hosted by Alex Garrett-Smith (Technical Education Lead at BitterBrains, founder of Codecourse), you’ll build on a working prototype and see how to ship dynamic UI without turning your app into a fragile mess of conditionals. You’ll learn how to: Wire up an app where data and freeform prompts decide which tools get called See Generative UI in action across two completely different apps Keep the model on a leash and ditch the conditionals Walk away with a working prototype you can pull apart 🗓️ June 3, 2026, 4:00 PM CEST / 10:00 AM EDT | ⏱️ 90-minute free workshop → Save your free seat Workshop 2: Build a frontend website with Kiro - Agent Skills + Spec-driven development (Saurabh Rob Dahal) Workshop 2: Build a frontend website with Kiro - Agent Skills + Spec-driven development (Saurabh Rob Dahal) If you’ve ever pointed a “capable” model at a frontend task and gotten something technically correct but totally wrong, you’ve hit the real issue: no spec → the agent guesses intent. In this hands-on workshop, Saurabh Rob Dahal (Sr Developer Advocate at Amazon AWS) walks through spec-driven development using Kiro, Amazon’s agentic coding IDE built around specs and Agent Skills, so the output stops surprising you and starts matching what “done” actually means. In the workshop you’ll: Get free access and credits for Kiro, no card required Build a frontend website using Kiro’s spec-driven workflow from scratch Work with Agent Skills purpose-built for front-end development, backed by Anthropic Claude Opus 4.6 and other frontier models 📅 June 3, 2026, 7:15 PM CEST / 1:15 PM EDT |⏱️ 2-hour workshop → Save your free seat 💡Tip of the week from Daniel Kelly Need an element’s calculated height based on dynamic content? You could render a hidden version, first but that’s sloppy and slow. Pretext calculates text height BEFORE render, keeping chat threads, card feeds & whiteboards smooth. Reactive, predictable, and faster. Better for your @vuejs apps! Turn your images on to see this weekly tip from Daniel. From the BitterBrains network Training, events, and courses from our broader developer ecosystem Unlearn, the system behind shipping AI code with confidence Every week without a structured approach to AI development is a week of guessing. Unlearn gives you the workflows, courses, and tools to stop guessing and start shipping with confidence. Early bird pricing is still open at $219/yr. → Get access Explore modern Vue 40% off Get full access to RAG with Nuxt and Gemini File Search plus 84+ Vue and Nuxt courses covering AI workflows, frontend architecture, performance, and modern development patterns. → Get access and keep building That’s it for this week. Got a topic you want us to break down next or something interesting you're working on? Just reply and let us know. Kind regards, Maria vueschool.io Facebook X GitHub BlueSky LinkedIn YouTube Instagram TikTok Vue School is proudly part of BitterBrains – Making Developers’ Lives Easier Become a BitterBrains Community Supporter here. Courses | Vue.js Master Class | Workshops | Tutorials | Plans 🔕 Not interested? Mute Weekly Newsletter here. You received this email because you are subscribed to Marketing Information at thomas+vueschool@brew.marketing. Manage email preferences 2093 Philadelphia Pike #9442, Claymont, Delaware 19703, United States [Open and remix this design](https://brew.new/templates/vueschool/portless-https-setups-collaborative-nuxt-editors-and-vue-directives) [Browse email designs](https://brew.new/browse/templates)