The Art of Vue.js

Much like Sun Tzu’s The Art of War, the documentation is a collection of skills on how to create a simple and quick single page application. I recently took an open source class in our Computer Science curriculum at Oregon State where you can focus on one or multiple FOSS projects. I slowly have been working to deepen my knowledge of front-end frameworks and I decided to go with Vue.js for its appeal in the open source community compared to its arch-rival, React.js. (Technically, open source under Facebook so…) It was through this time to interact with the open source community behind Vue is when I discovered my absolute love for Vue and the ecosystem around it for creating single-page applications. I want to use this post to tell you some simply awesome things Vue offers for anyone wanting to learn it and add Vue to your war chest.

First thing is first, lets talk about the ecosystem and how easy it can make getting started. You should immediately install the Vue CLI (Command Line Interface). Some IDEs will automatically do this, but with the simple “vue create” within a directory, it will completely setup your environment to get you right off the ground. Then you can continue to use the CLI to install things like Vue Router which is a powerful tool to take care of all the routing in your web application. You can build a full web application within a few lines of code so you can get right to it.

Secondly, the use of components will make your life much better. This is a lot of other framework’s basis, but Vue makes it very simple. You do not need to worry about importing and exporting specific variables. You can get anything done within the Vue component. Then, you can go down the rabbit home of importing components within components. Everything is reusable. You don’t have to rewrite a whole component to import it into anything else.

Thirdly, integrating it into other code. You can easily integrate Vue into other projects. I have built a full profile website in Github Pages with routing and everything within one HTML file. It makes life easy and simple. You can build a web application within anything. It is great and highly flexible. A tenet of Vue is that it is “Progressive” so you can implement it in bursts.

These are only a few of the great points of Vue.js and why I love it. It can do just about anything you want. I won’t even go into binding inline styles and classes to allow everything to be dynamic.