Vue.js Hello World

by Divya Manu

HTML

<script src="http://vuejs.org/js/vue.min.js"></script>
<div id="demo">
  <h1>{{title | uppercase}} ,{{name}}</h1>
  <input v-model="name" placeholder="Your Name pls">

</div>

CSS

body {
  font-family: Helvetica Neue, Arial, sans-serif;
}

input {
  padding: 8px;
  display: block;
  border: none;
  border-bottom: 2px solid #ccc;
  width: 100%;
}

h1 {
  color: #2e71ff;
  font-family: cursive;
}

JavaScript

var demo = new Vue({
  el: '#demo',
  data: {
    title: 'Hello there',
    name: '',
  }
})