Vue.js – the new underdog in the JS ring

Why Vue.js?

JavaScript to Web Development is like an engine to a mechanic – the job is just not going to work without it. As there are about as many (good) JS frameworks as there are car brands, picking the right one can get confusing pretty fast. Whoever you ask will have an opinion, and asking 5 people will likely get you five different answers, all with good arguments as to why their favourite is, obviously, the best.

Unfortunately, there is no one-size-fits-all. Personal preferences, projects, teams all factor into making the ‘right’ decision – but some frameworks are definitely more versatile than others. ‘Purists’ will argue that Backbone, being very small and light is the best choice, ‘Traditionalists’ will argue that jQuery is the go-to solution, and so on and so forth.

While some trial and error will probably be required to find the best solution for you, vue.js is definitely worth a look. Not as ‘bare’ as backbone, not nearly as rigid and huge as Angular or React it gets the job done without any additional libraries, extensions, plug-ins or what-have-you’s.

That isn’t to say that there aren’t any – in awesome-vue you will find anything your heart desires, the selling point is, however, that you won’t need them. Focussed on the view layer, it is still perfectly capable of powering single-page apps all by itself.

How does vue.js compare to the big players?

All that is good and well, but what is it that makes vue.js so different? Let’s take a look at what it can do. The most similar in scope would be react.js, in that both focus on the core library, using companion libraries for things like routing or GSM.

Completely different from React, which uses only bare CSS, Vue happily let’s the programmers incorporate CSS and HTML without making them reinvent the wheel each time. This makes Vue more easily legible, while also simplifying the effort needed for a piece of code.

The other big competitor here is Angular. Angular 1 inspired Vues developers very early on, however ultimately, Angular is by far more rigid and restrictive. Angular 2, being a completely different system much better suited to bigger applications and projects, is known for it’s rather steep learning curve. It’s not a difficult to use framework, but it can be difficult to get into. Vue is much simpler – it assumes only that you know HTML and JavaScript, making it easier to get into.

The developers even boast that you can write complete applications within less than a day of reading the documentation and guide – they’re not wrong. It’s that easy.

Vue’s ‘Hello World’

A good example to show off Vue’s simplicity is its variation of Hello World. As mentioned before, it really doesn’t assume very much about what it will be used for, simply that the data given will change. This can be shown easily, with just a Hello World.

To those familiar with JavaScript, this code should be easy to read. Vue.js allows for high efficiency – meaning less code than in many alternative frameworks – all the while still being very easy to read, and easy for those not familiar with Vue to understand and work with.

Using this example, all you would need to do to change the message displayed in the app is to use the line app.message to assign a different output to it in the console. Vue is very much built towards input changing the data given – and that makes it an invaluable framework for projects of all sizes.

Though this is very much standard now, Vue.js comes with very well-written documentation. They boast that you can write code within a day of reading it. Assuming you know JavaScript and HTML, maybe even CSS (and if you don’t, why did you read this far?), you’ll be well on your way to building your first app halfway through the documentation.

Vue.js is the new kid on the block – Vue 2.0 has only been out since April 2016, so it’s still very much in progress. The developers are very much open to input from developers that use their framework. Less rigid than established frameworks, even the likes of lodash/Underscore, changes to it are still possible and depend on user-input.

You could influence the very system you use, and help improve on it. As a developer – who wouldn’t want to help with the very framework they are using?