/Logos/ae-logo-pos-rgb.svg){kind=logo}
The battle for the best Front End framework continues in full force. Now that AngularJs has officially entered its End of Life period, we are once again faced with the question: which framework should we pick for our next Web app1?
Vue.js is all the rage these days. Although it exists for quite a few years, it's still the new kid on the block. Naturally, we've been following up on it closely at AE. Will this small but lovable framework make its way to the top, and stand proud next to the giants Angular and React? Let's find out!
It's decision time!
Picking a new Front End framework is not a choice that should be taken lightly. This especially applies to large enterprises, who typically make this choice at least for the next 3 to 5 years. It is vital that during this period, the framework is well supported and that it's easy enough to find developers with the right skills.
In my opinion, Vue.js has made it: we can finally say that Vue is a safe and future-proof choice to make. In fact, I consider Vue to be an excellent framework and a great choice for web applications, whether you are developing for a small start-up or a large enterprise.
We decided to use Vue.js for our latest Web project, and we haven’t looked back! Here's why.
Why we loved Vue.js
1. Intuitive
Only one person in our team actually read a Vue.js tutorial. The rest just dove right in, looking things up along the way, and were immediately productive. Vue.js is straightforward and intuitive. If you're coming from an AngularJS background, you'll have an easy time mastering Vue.
2. Lightweight
The Vue.js script is only 20k gzipped. It doesn't include a gazillion plugins, services and features. Instead, you just add whatever you need.
3. Vue CLI
Vue provides a CLI, which allows you to set up a production-ready app within minutes. Apart from adding common plugins like Vue Router and Vuex, you receive out of the box support for TypeScript, transpiling, linting, bundling, cache busting, testing and Progressive Web Apps. Vue CLI also provides a local development environment with automatic live reload, for increased productivity. It saves you hours, if not days, from a manual setup. Both Angular and React offer similar tools.
4. TypeScript support
Unlike Angular, where TypeScript is a first class citizen of the framework, TypeScript support came rather recently to Vue. TypeScript is now well integrated, and it is super easy to set up thanks to Vue CLI. We do use a couple of extra libraries to get the most out of TypeScript, which are listed below.
5. Vibrant community & well supported libraries
The Vue ecosystem is mature, and plugins are very easy to integrate. During development, our team had no problem finding the libraries we needed. Any issues we ran into were quickly resolved by the community.
6. Animations
Animations are built into Vue and make it really easy to add flair to components and lists. It only requires a single HTML element and a CSS keyframe.
7. .vue files
When we first started using .vue files, we were a bit wary. ‘Are we supposed to write HTML, TypeScript and Sass in the same file?’. But we decided to give it a try and it is AWESOME. Writing all the code for a component without ever having to switch files, is an incredible productivity boost. Good IDE support is of course required, but both IntelliJ IDEA and Visual Studio Code provide this, either out of the box or through the use of plugins.
8. Great docs and tutorials
Although you don't often need them because the code is so intuitive, the docs are simply wonderful. Easy to find, up to date, concise and clear. What more do you want?
In short: Vue.js is a framework that works for you, not against you. Development is a breeze. It just works. On the contrary, developing with Angular, to me, felt like a constant struggle.
Let's talk tech
Since Vue doesn't ship with tons of plugins included, you do need to make some choices when it comes to putting your app together. This can be a bit daunting, especially coming from an Angular(Js) background, where all these decisions are made for you. Fortunately, the Vue ecosystem helps you out quite a bit. These are the tech choices we made.
To set up our app, we used Vue CLI. We immediately included Vue Router, for obvious reasons. Next up was Vuex, a state management plugin offering a redux architecture that is well integrated with Vue. We had a great experience with both of these plugins. For enhanced TypeScript support, we use vue-property-decorator and vuex-class. Axios is used for http calls. We added d3.js for charts and other visuals. For form validation, we tried vee-validate, but felt it didn't suit our needs. We moved on to vue-form, which works nicely.
Yes, I'm convinced! But my boss is not...
Here are some pointers on how to convince your boss. If all else fails, buy him a bottle of whisky.
1. Vue is easy
Vue has a gentle learning curve and increases developer productivity. For our team, this allowed spending more time on User Experience and delightful design. For your boss, it might mean faster shipping, lower costs, and getting new developers quickly up to speed. This especially applies to developers coming from an AngularJs background. They will have an easier time adopting Vue, than adopting Angular.
2. Vue is good
The State of JavaScript 2017 revealed that more than 50% of Front End developers would like to learn Vue. Even more impressive: over 90% of developers who have experience with Vue, would use it again. This is in stark contrast with Angular, which scores a meager 66% on the same question. We all seem to agree: Vue is good. It truly combines the best of AngularJs and React. It is fast, light and easy. What's not to like?
3. Angular is not AngularJs
There is a difference between AngularJS and Angular. Make sure your boss knows this. These frameworks have little in common except for their name. 'Duh', you might say, but if you're not a Front End developer, chances are you’ve been mixing the two up. Make sure the decision is based on facts, not an unfortunate naming confusion.
4. Vue is future proof
The Front End community adores Vue. Although the Vue community isn't yet as large as the ones surrounding Angular or React, it is very vibrant and growing at an impressive speed. Here’s a fact: when looking at Github stars, Vue.js is currently the most popular framework, and it is still growing!
So, what are you afraid of? Give it a try! I’m convinced that Vue.js will not only conquer the Front End world, but also your heart.
