The `@click` and `:class` are in fact shorthands for `v-on:click` and `v-bind:class`. All directives start with `v-` by default. Shorthands are provided because

The `@click` and `:class` are in fact shorthands for `v-on:click` and `v-bind:class`. All directives start with `v-` by default. Shorthands are provided because these are two most often used directives. Re moving away from JS classes: ES2015 class is inadequate due to the lack of static property initializers, and I don't want to force users to use stage 0 transforms. A Vue component definition is essentially an object of options, which is in fact easier than having to extend a base class. Also see https://medium.com/@dan_abramov/how-to-use-classes-and-sleep-at-night-9af8de78ccb4#.m84lv4l2k https://medium.com/@dan_abramov/how-to-use-classes-and-sleep... For the template, that's just because it's a one-pager demo and I don't want to use an inline string template. The proper experience is using single file Vue components: http://vuejs.org/guide/application.html#Single_File_Components http://vuejs.org/guide/application.html#Single_File_Componen... `replace: true` is a legacy option I forgot to remove in the demo :P