December 19, 2018
Vue might have started as a small project driven by developer needs of its creator, Evan You, but it has matured considerably over the years—becoming a full-fledged framework with a grownup ecosystem and developer tooling. Along the way, Vue attracted a decent number of contributors, sponsors, and evangelists.
Vue.js wins all the GitHub stars. Source: Tim Qian
On the JS front-end framework battlefield, however, React wins with Vue.js in terms of popularity and commercial usage. Yet, there’s no doubt Vue is here to stay and is slowly but progressively stepping into developers’ reality.
I think Vue got the highest satisfaction rating among frameworks in State of JS this year (91.2%) - thanks to our users, and we aim to do even better! Hope we can change the mind of the 568 people who don’t want to use it again ;) https://t.co/7MrM8Y4ekq— Evan You (@youyuxi) November 19, 2018
Let’s take a look at the stats.
Percentage of “Heard of it, would like to learn” responses. Source: stateofjs.com
By building on the best ingredients of Angular and React and adding its own unique spice to the mix, Vue turned out tasty enough to induce constant appetite in JS developers.
Here’s why Vue gains more traction.
Vue’s gentle learning curve steals the hearts of beginners and advanced developers. The software developers we asked in our State of Vue.js report said the learning curve is what sparks so much interest around Vue. After going over the materials included in the official guide, you can go ahead and start making your first Vue app—no prior knowledge of ES2015, TypeScript, JSX, or build systems required.
Vue’s high accessibility helps fast-paced dev teams get all their creative juices going without having to spend a lot of time familiarizing themselves with additional syntax extensions. Putting together a team for a project or integrating Vue into one is easier and faster. Even though there aren’t many Vue developers on the market yet, developers experienced in React can easily switch to Vue and start delivering value within more or less a week.
Vue also cuts the time required to grasp the complexity common to, for example Angular, which is particularly handy when writing simple web apps.
Web apps in Vue are built with the use of components. While it already gives devs lots of flexibility and adaptability as per project needs, Vue’s single-file components are loosely coupled, which improves code reuse and decreases development time.
Component-based architecture is ideal for building apps with the intention of future scaling. In Vue, building large-scale apps requires using a modularized build system from the get-go. But Vue gives devs some flexibility here because the bundlers recommended by Vue, Webpack or Browserify, come with the ability to later transform the source code with preprocessors of your choice.
At Monterail, our devs frequently highlight the sheer pleasure with which they build apps in Vue. The freedom to structure the code as it pleases the developer and the unopinionated way of coding are main reasons why there’s so much love for Vue.
Sorting through the codebase is hasslefree—practically everything you need is inside the .vue file. From the data model and template to CSS, properties, computed values, and methods, getting to know the job of a component spares you an additional headache.
With a rich collection of libraries and set of tools facilitating development, the Vue world has everything a developer needs. The more notable tools that amplify coding experience are the excellent Vuex for state management and vue-routing for routing and mapping your single-page app states to respective URLs.
Vue also has its own DevTools, which come in the form of a browser extension. DevTools simplify application debugging and checking the state and hierarchy of components. They allow you to live-edit your app, track custom events, and time-travel debug your app to see previous versions and the changes made.
Vue’s ecosystem. Source: GitHub
Vue offers developers a few solutions for cross-platform mobile UI development. There’s Weex, created by the e-commerce platform Alibaba, and NativeScript with its vast repository of tools, components, and plugins. Recently, Ionic, too, came aboard the Vue mobile development team.
In contrary to React Native’s “Learn once, write anything”, both Weex and NativeScript say “Write it once, run it anywhere”. This approach enables you to manage the UI in a transparent and repeatable way between multiple platforms. That’s quite awesome.
Data in various HTML elements renders dynamically in modern web apps. Vue is equipped with its proprietary reactivity mechanism that refreshes user interface automatically. This approach saves a lot of time and additional lines of code that the developer can use to focus on introducing other features and be more productive.
Vue.js is fast. It’s not the fastest framework in the hood, but what’s currently available with Vue.js is plenty enough to deliver impeccable UX in SPAs as well as UIs.
Startup metrics (lighthouse with mobile simulation). Source: Stefan Krause
This is somewhat debatable, but Vue’s HTML-based templates increase productivity, especially for those of us with an HTML background. Vue’s templates also help to introduce reactivity features into existing web apps. The templates are compiled by Vue to have the virtual DOM render functionality. As a result, during app state change, Vue introduces a minimum number of manipulations to the DOM.
Vue’s community is blooming and actively contributing to the development of the framework. Several big conferences take place annually all over the world that are devoted wholly to Vue. The 2017’s VueConf in Wrocław, Poland, that we helped to organize ignited the Vue-related conference storm all over the world.
Here are some of the upcoming conferences worth checking out:
But the community also organizes not just full-blown conferences. Vue meetups happen in multiple countries on six continents. Over a beer or coffee, Vue developers can exchange their knowledge and experiences with using the framework.
Vue.js has downright excellent official documentation that lets developers discover pretty much every aspect of Vue and its ecosystem. The official guide has examples and detailed descriptions. API docs target most issues devs might encounter while coding.
Aside from learning Vue via the official guide, you can also master the art of coding in Vue by using some of the available tutorials, with videos and examples included. The free courses guide you through Vue in a thorough and fun manner—especially Scrimba (recommended by Vue).
For various code riddles not covered in courses and tutorials, you can ask a question on StackOverflow. New questions and answers pop up all the time, so there’s a good chance you will get your question answered regardless of its complexity.
And when you’re stuck with a pressing coding issue you won’t be left alone—you can ask fellow coders for help on the official Vue chat and receive a prompt answer.
Since its launch in 2014, a lot of developers were reluctant to adopt Vue for fear of its abandonment, leaving everyone involved with a painstaking and costly task of merging into another framework. But that, of course, didn’t happen. In September, Evan You announced Vue.js 3.0. And even though there’s no definite release date as of yet, what’s important about the update is that it’s based on contribution and public feedback. Without corporate backing of known brands, Vue’s rapid rate of evolvement is a remarkable feat.
Vue’s ecosystem is getting bigger and better, gaining more and more appreciation of the developers and businesses alike.
As for support in the back-end part of the field, Laravel, the PHP framework, recommends using Vue.js for front-end development, although it’s not a requirement.
In short, yes. However, Vue is not the only noteworthy and promising JS front-end framework out there. You’ll probably be best off testing out and working with a few frameworks to see for yourself which ones work for your projects and intended use and which do not.
So even though we love Vue, it’s not a perfect framework. But let’s be honest: it’s as close to perfect as it can be. And if we’re judging frameworks by their learning curve, maintenance continuity, and ability to spur developer productivity, then Vue.js shines like nothing else.