Why I keep an eye on the Vue ecosystem and you should too

Vue

Who doesn't know that one guy, shouting Vue mentioned on every occasion he gets because he pretends people care.
I might be one of them.
So, what is so special about the Vue ecosystem that makes me think people should keep an eye on it, even if they don't use vue?
Simply put, it generally just builds tomorrows tools for everybody.
The first tool that would come to mind would probably be vite.

Vite

Vite came out in 2020 and is one of the fastest exploding tools in webdev I personally witnessed. From release to pretty much everybody is using it and shaming create-react-app was only about 2 years.
Of course this happened for good reason, a basic setup was relatively easy, it had a very powerful plugin system, and compared to it's competition it was blazingly fast.

Volar

Volar originally was Vue3's language support tool for VScode (I don't know about other editors). By today, volar has become a language indipendent framework to create language tools. It might still be a bit early for the dev with skill issues like me to use it and build some tools, but astro and svelte already use Volar to create their language tools.

Now, moving on to the reason I actually wanted to write this post

UnJS

UnJS is a collection of framework agnostic single purpose tools that are actually great, trust me bro.
If that didn't convince you, maybe the nearly 400 million downloads per month might.
So, what packages are there? Why should I care?

DevTools

The (devtools)[https://devtools.nuxt.com/] I want to talk about shortly are the (Nuxt)[https://nuxt.com/] devtools which are I would say by a landslide the best devtools out there. You don't need to trust me, just try it out, get a basic nuxt app running, open devtools, go to modules, add tailwind, maybe add an API route and play around with the dev tools a bit. I'm pretty confident in saying that it's the best experience out there in JS land, and belive it or not, the plan is to make it vue/nuxt agnostic, so it might become something react, svelte etc devs would enjoy in the future

Nitro

Nitro is a nice https webserver that you can deploy everywhere. Comparing it to express, it doesn't need weird middlewares for json, it has a simple way to support caching, a file system router, tasks and scheduled tasks that avoid quite a few shell scripts, db:migrations etc, plugins, KV storages, SQL connectors, websockets...

h3

H3 is a small and delightful webserver.
It honestly won me over the second I saw how simple the server side implementation of websockets was.
It's actually so good, it even has bindings for uploadthing

app.use(
  "/_ws",
  defineWebSocketHandler({ // handles all the magic upgrade etc
    open(peer) {
      console.log("[ws] open", peer);
    },

    message(peer, message) {
      console.log("[ws] message", peer, message);
      if (message.text().includes("ping")) {
        peer.send("pong");
      }
    },

    close(peer, event) {
      console.log("[ws] close", peer, event);
    },

    error(peer, error) {
      console.log("[ws] error", peer, error);
    },
  }),
);

Now, good developers will tell you that the upgrade of the connection to a websocket is not that bad. Now I'm not a good developer, I had quite some issues to make that work in the past. Also, server sent events are also first party supported, which is always nice.

uqr

Uqr is a library used to generate QR codes. You can even render them as ANSI SVG codes, which means you can print them in the console.

I can't be bothered to write the rest, so I'll just list the most intresting ones for me personally

• Consola Simple to use console wrapper that allows to have pretty console IO [sourced by Consola docs homepage]
• magic-regexp How about Regexp that get's compiled away, is typesafe and it's actually somewhat legible
• unimport is the plugin that powers the magic auto imports for nuxt, it's actually quite simple to set up

There are tons of other packages around bundling, vite, webkack, generic JS utility, configurations, default values etc... It's an interesting and always evolving ecosystem of generally good documented tools with solid performance and exceptional dx