My Vue + Nuxt AI Coding Setup in 2026

If you're a Vue or front-end developer, listen up. I have my AI workflow that I want to show you. I think you're going to find this very interesting, probably some tools that you don't use, and maybe some that you do. I'm going to give you some of my opinions, especially if you're a Vue, Nuxt, React developer, listen up. First, there's been a lot of talk about what models to use, and I have some opinions on this. Really, I think that you can use any of the latest frontier models when you're creating your latest Vue app, and you'll be fine. Now, you do need to add a few more things, which I'll talk about in a moment. There's been a lot of debate that maybe Claude Opus is better for this scenario, and maybe if you're doing design, you should use this model, but I found that they're very equivalent, and I don't really see any reason not to just use the latest Claude Opus model. In fact, if you go to arena.ai and their leaderboard for web dev, all the Claude and all the Anthropic models are at the top. I would just use the latest and greatest. Let me know in the comments if you disagree if you found a model that you really like. Second, you really need to add in skills. Now, there's been a lot of talk about skills. If you don't know, they're basically specific, detailed instructions on how to work with certain programming languages or certain things that you're trying to do. Obviously, in this channel, I talk a lot about Vue, so the one I recommend if you want to kind of go down this road and you're a Vue or Nuxt developer, there is an official Vue.js AI skills, and it's more of an experiment at this time. They're calling it an experiment in creating specialized skills for AI agents to enhance Vue 3 development. I've actually found that they're pretty opinionated, and they do a pretty good job. And of course, here's a bunch of instructions how to install it. And by the way, I'll put a link for this in the description if you want to follow along. The one I really like the best out of this after playing around with it a lot is the Vue best practices. And the nice thing about this, it gives you some very succinct best practices, things that I obviously think you should do, like use the script setup. And then if you're using the options API, then load this view options API best practices. I don't know why you're still using the options API, put down in the comments if you still are. Or if you're using JSX, use the JSX best practices. It has a lot of great information and it has this huge references folder. So like if you're using composables, here's all the information that you should be using with composables. So this feels like one step above just the official documentation. It has a few more opinions. And I think this is the one you want to download if you are a Vue or Nuxt developer. Anthony Fu also created a pretty good skills repository here. He's just calling it a proof of concept right now, but I would never count Anthony Fu out. He makes so many great projects and he shares it all in the open source community. He essentially just took the official documentation and then created the skills out of it. But even so, I think it's worth checking out, maybe try to download some of these and see how it goes. If you don't want to use Anthony Fu's, Alex Lich recommended this to me. It's just pretty useful. You can take GitHub repositories and even without the maintainers' consent, you can have it like pull down the official documentation, pull down the NPM package and create skills from it. I haven't tried it, but it looks very, very useful. You can also look at a whole bunch of collections of skills that have already been created from everything out there. Another few that have just been getting a lot of information, I think I got to give it a quick shoutout for is Matt Pocock's skills. If you haven't seen, he is a YouTuber, really well respected and he's been creating a lot of skills. His probably most viral one everybody's talking about is {slash} girl me. Kind of asks clarifying questions while you're working with your coding editor, which seems obvious, but not really. I mean, there's so many times where I wish my coding editor would have asked me something, and now Girl Me helps me with that. He even created an updated video just in the last week or two, where he says, "Don't use Girl Me, use like Girl with Docs." He like added some more updates to it. I would try that out. I've used Girl Me. It's really helpful. I'll put a link to this in the description as well. Daniel Kelly told me about this PR review expert, and there's a few of them out here. This is kind of the way you want to do it. You can create a PR and then run this review expert on the code, either be after you already create the PR or even before you create the PR. If you just have the code out there and it hasn't been committed yet, you can run this, and it gives you some nice analysis of it. Of course, if you're doing this in production, you're probably using Code Rabbit or some other automated tool to test your PRs, but this could be a nice little thing you can run before you commit it. Uh there is two directories I think are kind of the standard right now to find skills. There's skills.sh. You can just search. Like here, I can see a view. Here's a bunch of ones you create a view, include Anthony's skills one. And then there's this skill marketplace, and once again, you can just search. Uh and it will give you a whole bunch of different skills people have created, even a view expert. If you find a skill that you really like, let me know. Here is how I would do this here. So, another thing I would recommend in your editor, I'm using Kura CLI. This is my favorite editor. I also use Kura CLI and Claude Code. If you want to you're in a a a project, you want to create an agents.md, or we call it in Kuras a steering file, or a rules file, and just put in some helpful rules. I talked to Alex Lichter, and he actually gave me some of his favorite rules. I'll put the link in the description if you want to see some of these. Always use composition API. Prefer ref over reactive. So, this sort of sounds like the skills, but one nice thing about this is this will be added into the context every time we talk back and forth. The agent, we don't have to activate the skill at all. Another thing, it's only 42 lines long. You have to be really, really careful when you work with and you add stuff to agents.md. If you have too much in there, it can really bog down your context. And if you have too little, it's not really necessary. So, I obviously wouldn't make this huge. I was talking to Daniel Kelly the other day. He's a big at Vue school and he told me he always likes to use Nuxt layers to keep features modular. Always to use the Vue best practices skill and the Nuxt skill. So, it will automatically activate that. One problem sometimes you have with skills is they don't always activate. So, let's try it out. So, this is a brand new empty Vue project and the only skills I have are the I had the PR review skill and the Vue best practices one. And then I have my agents.md. So, I'm saying create a composable that fetches a list of GitHub repositories for given usernames. It should handle loading and error states. So, you can see here it's loading the agents.md file that it knows to load that best practices cuz we put it directly in the agents.md to always do that. So, now it's going to go ahead and create it. And let's take a look what it does. Okay, so it created the GitHub use GitHub repo.ts. Use that shallow ref, is loading. Now, let's take a look at it. Okay, so I'm going to open it up. So, here it is. So, one thing I really like is this interface. This is a part of the best practices in the composable section. It also it prefers to use shallow ref, which we said earlier is something that we really prefer. It's also using this await and then if catch. So, it's not doing a dot catch or dot finally. I really like this. This is a part of the best practices, too, I believe. It's also checking for 403, so for rate limiting and exceptions. Pretty good and returns it all for me uh nicely formatted. So, this is really nice following the best practices that that we want. Uh and then from here I could add this into my application. These are just a few things that are important. Let me know what sort of things you're doing and if you like these videos, I'll create a few more. So, make sure you like and share this with somebody if this was helpful. Take care and also always find me on uh the socials. Uh the social links are in the description. Definitely connect with me on LinkedIn at Eric Hanchett and follow me Eric CH on Blue Sky X. Thanks.