[1] https://vuedesigner.com

[2] https://www.youtube.com/watch?v=0gkPK1vxH9I

[3] https://docs.pinegrow.com/docs/vue/tutorials-courses/

thank you so much for sharing this site! I've been having a hard time wrapping my head around some Vue2->Vue3 changes and this is very helpful

Easily Vue 3, the dev tooling/xp + docs are much better over Vue 2.

I’m learning Vue. For both professional and hobby usage.

So far, the switch from jQuery, thrills me.

Vue in general has been a godsend to me at least. When I was in college, we used AngularJS for web development courses at the time. My first job had me working with Qt and Tkinter. When I finally had the chance to do web development again, my team chose Vue and it was so easy to pick up from my AngularJS background.

My current team is using Vue 3 with the Composition API and it is way more forgiving with mistakes than the Options API. I've helped transition 3 developers so far to Vue 3 and they all love what Vue has to offer when compared to React.

https://alternativeto.net/software/vue-js/about/

Interesting, how long have you been using Vue3? I'm only 3 weeks in and still waiting for that video or diagram or tutorial that really inform me on why all of this extreme overhead is needed to perform simple tasks.

Does anyone have any good resources that made them enjoy the Composition api, Pinia etc?

if you want out of the box Vue 3 component framework, try https://quasar.dev/

Explore the inner workings of Vue.js 3 reactivity system, from leveraging JavaScript Proxies to mastering the powerful reactivity APIs like reactive, ref, computed, and watch. Gain expert knowledge on building reusable composables, avoiding common pitfalls, and optimizing performance to create scalable and maintainable Vue applications with confidence.

Just use Vue. It's perfect for this use case, has a ton of help online if you need and plenty of paths to take if you want to upgrade your project in any direction. Seriously way reinvent the wheel here?

Would you say Vue 2 or Vue 3 would be better for someone venturing into Vue? Also, have you used Svelte much?

https://lachlan-miller.me/ - some articles on Vue, some personal thoughts, and links to my paid content and resume.

I think the documentation for Vue is pretty good.

https://github.com/vuejs/petite-vue

Explore the dynamic interaction between Vue.js 3 and WebSocket technology to construct responsive real-time applications that offer users instant, two-way communication. Learn how to design, implement, and optimize a seamless data flow, ensuring your application scales effectively while maintaining high performance and robust error handling.

I get the impression that Vue 3 was a greater effort than expected. It was talked about for years before beta release (on Full Stack Radio, for example). March of 2020, I was at Vue Conf (days before Covid lockdowns began), and I heard a few people complaining that this wasn't the expected official Vue 3 release. Here we are almost two years after that and it's just becoming the default.

That said, I understand that there were monumental under-the-hood improvements, some of which spawned off Vite.

…Vue in this case?

Any resources/examples you'd recommend for a Vue frontend w/django? I've been pretty firmly in backend land for a while and would to experiment with the other half of the puzzle!

You might find the following useful :

Visual Understanding Environment - https://vue.tufts.edu/

Came across this in another thread recently - https://quarto.org/

A backend dev with minor FE exp here.

1. I would go with Vue. Because Vue is focused towards DX and pragmatism. It provides good defaults to start with and flexibility to go through less travelled paths should you need it.

Part of the reason is that when I first tried react (in 2016), I couldn't get it to build. And setting up build tools was not easy.

Vue can be used with a single script tag, so I was able to get it up and running without any issue.

I started with Vue 1, and recently worked on a project using Vue 3. Despite my gap and version changes, I was able to get up and running without issues.

2. Vue docs are great resources. Personally I prefer video courses to get started and then docs and guides. I can personally vouch for Laracasts Vue tutorials.

I reach for Vue + Vuetify (a Material Design UI component library) to get things going quickly. Vue is extremely easy to learn and can be incorporated with a script tag if you prefer. Vuetify faithfully implements almost the entire Material Web Components spec, so you have everything you need to build polished, functional web apps. It’s also got very nice documentation.

I am in a similar situation as you (with the addition that I am an amateur dev).

I use either Quasar, a Vue3 framework (vue it's very easy to learn and quasar does all the heavy lifting, plus has plenty of components), or recently Vite with Tailwind CSS (this allows you to better control the style).

I would recommend to study with an empty Quasar project and build from there.

Can you describe the vue 3 part more? As an outsider it just looks for me they just added another api with a different style, so people can choose what they like.

1) Vue 2: two years of support. Man.

2) we REALLY need a sort of "reference implementation" website that does the typical things a website needs to provide comparisons of approaches (hm, and performance benchmarks) to things like templating / html generation / data binding / etc.

I started using VueJS when I got thrown off the deprecation treadmill by Angular.

Regardless of whether something is a hobby project that you want to only touch a couple times a year or a big project with dozens of developers, having your platform deprecated under your feet and being forced to do migration work sucks.

Vue is now on version 3 within 10 years. That means anyone who relied on v1 has had their work churned away under their feet, twice.

If you started with Vue two years ago, you had to learn Vue 3 shortly after that. With a new Vuex. Which has been dropped since in favor of Pinia. Oh, Vite has been developed since, so you may want to add this to your stack, because it makes compiling during development so much faster. Also, be aware of all the breaking changes that Webpack 5 has introduced.

I hope front end development will be more stable in future, but the last two years where full of pretty major changes.

You're looking for Vue. It calls itself The Progressive Framework and the title fits.

The thing about Vue is that it spans the whole spectrum of a simple <script> tag à la jQuery all the way up to a fullstack app with server side rendering, jsx & typescript support, IDE plugin, browser debugger, and build system.

But the *great* thing about Vue is that you can start off with the simple <script> tag and add it to an existing project (built with other frameworks) and slowly build up to more Vue features if/as you need them.

It's learning curve is also incredibly smooth so you can ramp up the features to your specific needs.

Some examples:

- There's multiple well respected guides and video series out there to port old legacy enterprise Angular.js applications to Vue.js bit-by-bit until only Vue.js remains

- Laravel (the well known backend php system) has decided to use Vue for it's front-end integrations.

- Wikimedia (the foundation that runs Wikipedia) has decided to adopt Vue.

I'd go for VueJS.

As someone who worked with both, vue 3 is miles ahead imho. Scoped css, well working two-ways data binding (now being mimicked again with signals after mobx demise) and reactivity, easier to get performance out of the box without the hook madness.

I would use Vue3 (with Pinia, vue-router and typescript). There is also the Quasar framework based on those tools which provide many components out of the box.

My opinion: Vue, specifically the Vue 3 Composition API. Most of your UI state should come from computed() values. Bookmark https://vueuse.org and come back to it often. Go through VueUse's source (the docs for each function link to their source): you'll be surprised at how simple most of it is, and it works as documentation of best practices for using the composition API in general.

Does anyone keep a list of "goto" Vue codebases?

It sounds like you would appreciate Vue3 and its <script setup> mode, the compiler does a lot of ref() and data flow analysis to make the code for components very readable.

Vue 1.x was great, v2 lost its way, and Vue 3 with the composition API looks fantastic on paper. (I haven’t used it in any meaningful way)

I’m even more impressed with the extended Vue ecosystem like Vite, Vitest.

Vuex is going in direction of pinia. While Vuex has a v3 compatible build, it is there to ease migration, not as recommended for new vue 3 users

Worth noting that major frameworks have yet to update for Vue 3. Make sure you check all your dependencies before embarking on that course. I like Vue 3 so am finding this seemingly slow adoption to be a real pain.

I'm quite fond of Vuejs. It's easy to get started... my first experience with it was too drop in the CDN link and start with the basic example. It can easily do anything react can do.

Maybe you need vue3 .value

Vue took a hit because of issues with v2 to v3 migration. But situation is improving. With v2.7 beta just released and major ecosystem libraries and frameworks (vuetify and nuxt) catching up.

Then, there is a community effect. We all know vite and vitest are originally from vue ecosystem. As people start using them, they are more exposed to vue.

Vue is good

I would strongly recommend Vue3 in the composition style with <script setup>.

It's really close to svelte's style, of simplicity and principle of least astonishment. It also uses very explicit wrappers for reactive objects so that there's isn't as much magic happening. For me, vue's reactivity is order of magnitude simpler than things like svelte.

Vue also has a pretty well established community and a pretty solid foundation.

If you’re looking for a Vue-flavored dev experience as opposed to a react one, I recommend this:

https://github.com/antfu-collective/vitesse-webext

Building a web extension is pretty straightforward in Vite-land. There are some rough edges around hot reloading, but I doubt it could get that much better.

Try out https://vuejs.org/

It’s simpler to learn.

Guides are phenomenal.

Creator is a designer and author of Vite.

React is great in that it’s being developed by a great team of diverse engineers. However diversity comes with differing opinions of end user experiences.

In the world of product development and innovation, the role of a designer is often more impactful than that of an engineer, especially when it comes to shaping the overall user experience.

Designers possess the unique ability to understand the end user's needs, desires, and challenges, translating those insights into functional and aesthetically pleasing solutions. Their holistic perspective allows them to balance form and function in a way that elevates the value of the end product.

While engineers excel at the technical aspects of a project, ensuring that the underlying systems function properly and meet performance specifications, designers take a more human-centered approach. They focus on usability, ergonomics, and aesthetics, often serving as a bridge between the technical and the emotional aspects of a product. This ability to understand and empathize with the user is invaluable, as it ensures that the product not only performs well but also resonates with its intended audience on a deeper level.

Collaboration between designers and engineers is crucial, as their combined skills and expertise can lead to groundbreaking innovations. However, it is the designer's intuitive understanding of the user experience that often plays a key role in creating a product that stands out from the competition and truly resonates with consumers. By prioritizing the needs and desires of the end user, designers help to create products that are both functional and emotionally engaging, ultimately enhancing the overall success of a project.

Thus why the more granular and slower approach such as Vue is what I think is software framework done right.

OverVue is an open-source prototyping tool designed to help Vue developers seamlessly create and visualize Vue applications, utilizing an intuitive and responsive tree interface to display route & component hierarchy.

Vue survives just fine.

Sure, its market share is lower, but the quality of Vue 3 is on par with React. Most impressively, it comes with its own core libraries for routing [0] and state [1]. And by extension, has spawned library agnostic tooling in the form of Vite [2] and now Vitest. [3]

0 - https://router.vuejs.org/

1 - https://pinia.vuejs.org/

2 - https://vitejs.dev/

3 - https://vitest.dev/

Evan You, creator of Vue and Vite.

Really interesting guy. Good podcast here: https://corecursive.com/vue-with-evan-you/ and very, very much worth a listen.

His background isn't even software engineering but he has come to spearhead (at least?) two very major projects that have shaped modern web development: Vue and Vite. Both Vue and Vite are notably "simple" and fast relative to their contemporaries.

Vue really stands out as one of the few, pure community driven front-end frameworks that has achieved major uptake (both React and Angular came from the commercial space).

Vue.js is the JavaScript framework of choice for countless front-end developers because it’s easy to learn and use. Components are at the core of the Vue framework — they help you go from idea to a functioning UI much faster.

Daisy/Tailwind + Vue3 is my favorite front end toolset to date.

> Vue 3 with the composition API looks fantastic on paper. (I haven’t used it in any meaningful way)

Recently worked on migrating a large codebase over from a legacy solution to Vue 3 with composition API, it was a pretty enjoyable experience, especially with Pinia!

Though I'd say that the problem was that most component libraries/frameworks out there actually don't support Vue 3 well enough. Last I checked, only the following were viable with Vue 3:

- Ant Design

- Element Plus

- PrimeVue (went with this, also has icons and a layout solution; also alternatives available for React and Angular)

Most of the other ones considered weren't quite there yet:

- Vuetify

- Quasar

- BootstrapVue

- Vue Material

- Buefy

- View UI

- Vuikit

- Chakra UI

I mean, is it really so hard to get a bunch of pre-built components for Vue 3 with Bootstrap, or Bulma? It feels a bit like the Python 2 to Python 3 migration in some respects.

It's crazy how much of the ecosystem is behind, despite Vue 3 technically being available for a while now. Honestly think I'll be looking to migrate away from Vue instead of up to 3.x.

You have a few :

- https://alpinejs.dev/

- https://stimulus.hotwired.dev/

- https://github.com/vuejs/petite-vue

- https://v2.vuejs.org/v2/guide/ (using Inline-template)

- https://unpoly.com/

- jQuery (of course) / Vanilla JS

I inherited a vue2 codebase with a vuex store, and upgrading to vue3 and pinia one component at a time over a course of 3-4 months was quite easy. The upgrade path is really clear and they did a good job making everything compatible so that it could be made gradually over a relatively long time.

I use vuejs with create-vue for scaffolding. And then, google my way through.

Vue is easier to learn and uses html, css and js. So I feel right at home. Forms are particularly easier and vue dev tools help a lot in debugging.

Also, last year, I used it for an app after a break of 3+ years. I was still able to re-use a lot of prior knowledge (even if it was half forgotten). There was new syntax(comp api) and typescript introduced, but older syntax (options api) worked fine.

Maybe the Vue 3 transition and its composition API.

And Alpine https://alpinejs.dev/ and petite-vue https://github.com/vuejs/petite-vue

If you are non-programmer, then you need to stay away from whatever bleeding edge tech HN and Reddit raves about.

Instead pick a stable tech. In js framework land, no tech is stable. But relatively speaking, react, Vue and Angular are more stable and popular. Among these Vue is more newbie friendly than others.

So, I would start with Vue. Checkout laracasts course on vue 3 to get started.

Same here, this is how I found out about Vue 3

related: The mess we're in (a talk by Joe Armstrong)

https://www.youtube.com/watch?v=lKXe3HUG2l4

(yes, I know, I should have vendored the dependency in the first place)

I find Vue easier to learn than React and its documentation is great.

my projects are small indeed, one reason to use vue3+vite, I tried react and webpack, both have much deeper learning curve for me at least.