Vue.js Article

Introduction

Vue.js, which is commonly referred to as Vue, is an open-source JavaScript framework for building user interfaces and single-page applications.

The framework was created and developed by Evan You in early 2014. Evan You had previously worked at Google, using Angular in various projects and wanted to create something more lightweight.

Features

Vue allows for templating, which involves using HTML-based template syntax that allows binding the rendered DOM to the underlying Vue instance's data. The template system can also directly write render functions using JSX (JavaScript Syntax).

Vue features a reactivity system that uses plain JavaScript objects and optimized re-rendering. Each component keeps track of its reactive dependencies during its render, so the system knows precisely when to re-render and which components to re-render.

Vue also uses components, this feature extends basic HTML elements to encapsulate resuable code. A component is essentially a Vue instance with pre-defined options. This is a more object-oriented approach to developing websites.

Vue provides a variety of ways to apply transition effects when items are inserted, updated, or removed from the DOM. This includes tools to: Automatically apply classes for CSS transitions and animations, Integrating third-party CSS animation libraries, Using JavaScript to directly manipulate the DOM durin transition hooks and finally, Integrating third-party JavaScript animation libaries.

With Routing, Vue is able to by-pass the problems of single-page applications that are unable to share links to the exact "sub" page within a specific web page by using the front-end routers to provide artificial hash-based URLs originally split by a hashbang. Also, Vue provides an interface to change what is displayed on the page based on th current URL path - regardless of how it was changed.

Pros/Cons

Vue.js has its pros and cons:

Pros	Cons
Flexibility and TypeScript Support - Vue provides native support for TypeScript and also is very flexible in terms of being based from JavaScript as well as being able to create features, such as components, for example, in different ways. There is no "right way" in utilizing Vue's framework so you can design the app structure the way you want it to be.	(Over-)Flexibility - When working on bigger projects with many developers, the flexibility of Vue.js can over-complicate a project and lead to more errors and irregularities if you all don't adhere to one standard.
Size - The size of the Vue.js package is very small, weighing less than 20kB, compared to approximately 80kB for minified jQuery. The entire Vue ecosystem, is small and fast so choosing it means you are getting one of the best speed parameters available.	Small community - Vue is still relatively new compared to giants, such as Angular and ReactJS. The majority of its users are non-English speaking, most of the coding is written in Chinese, which may complicate things for English speaking developers. With the fast evolutio of Vue, tutorials posted online may be made obsolete very quickly, which may take you longer to find a solution.
Readability - The syntax of Vue.js is simple to read, this is usually the same standard across the board for other frameworks and technologies associated with JavaScript. Vue's components are pretty much a combination of HTML and JavaScript. Due to its simple structure it enables development of large scale templates and the developer can still easily track the blocks with any errors.	Minor issues with IOS and Safari - This makes it less cross browser compatible.
Reactivity - One of the best features of VueJS is its reactivity. Data binding between HTML and JS code has never been easier! Vue handles two-way reactive data-binding like a charm. When data is changed, the DOM is also changed accordingly. It's perfect for SPA's (Small page applications). It's perfect for any application that requires real-time updates.	Reactivity Caveats - Setting items directly from an array and adding new data properties can be quite bad depending on how your use cases are set up. However for most cases it's nice to have everything specified upfront inside "data".

Extra Programs

Other similar front end web frameworks and technologies such as ReactJS, Node.js, Angular
Basic Front End Web technologies such as HTML, CSS, JS
Interacting End Web technologies such as PHP, C#, ASP.net.
Styling Frameworks / Preprocessors - SASS, Bootstrap, LESS, Stylus

Sources

Summary

In conclusion:

Vue.js certainly does the job it's intended to, and succeeds in some areas that other frameworks fail. However, it is still very new and other JS based frameworks like Angular and React are much more established and better suited for English speaking developers. It is projected that Vue will catch up in the next few years, so it may be a handy tool to have in the near future. (Some web dev jobs do advertise for Vue knowledge)