An Ode to Vue.js

The web’s flexible simplicity

I’ve loved the web for many years for its basic but flexible simplicity.

I’m in awe of Roy Fielding, Tim Berners-Lee and however influential people who formed what the web (and internet) became. Their solutions are in a way incredibly complex, but in another dimension could be judged as overly-simplistic. But their solutions won out as a technical platform that’s difficult to fully appreciate.

In the world of developing for the web, there was a time when server-side rendering was just easier than in-browser rendering of data in a web application. Things got complicated; Angular v1 happened.

But out of a mess, simplicity wins out. And that is Vue.

Vue for developing the web

I’m quite excited about Vue.js, which is indeed a progressive JavaScript framework.

I’ve been using it to create a quiz-management interface for Bitesize Irish Gaelic. After that I’ll be developing the front-end of the feature in Vue. I hope to write a case study on it, once the feature is live.

To give you context, I like trimmed-down frameworks for web application development. For example, I’ve been a fan of the Slim PHP framework over the past few years, which does just enough really well. Keep it simple, stupid.

With Vue, it’s almost “too easy” to be able to add interactivity to a page. In the end, it’s the progressiveness that makes it shine for me. You can include the framework from a public URL in your HTML page, and quickly add interactivity. Once I figured out the structure that Vue expects, I was able to intuitivlely add interactivity to a page, like binding a piece of data to a form element. I knew exactly how to make an element like a button call a method that could interact with data in the page.

Include the Axios HTTP client in the same page, and you can dynamically show data from an API.

There are some catches, as always. You have to figure out Vue’s declarative nature. I had come across this with Angular v1, but it still took a little time to get used to. At the time of writing you can’t use camelCasing for naming events or “props” for components.

You’ll soon want single-file components in Vue.js, which will bring you to building your application instead of just including the framework in the HTML page. When you’ve gotten this far, you’re already launched into the possibilities of Vue.