Vue 2.0 Hello World

by itsazzad

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/build/build/faker.min.js"></script>

<div id="app">
  <app-sidebar></app-sidebar>
  <app-content></app-content>
</div>

JavaScript

const divisions = [
  'Barisal',
  'Chittagong',
  'Dhaka',
  'Khulna',
  'Mymensingh',
  'Rajshahi',
  'Rangpur',
  'Sylhet'
];

const users = [];
for (var i = 0; i < 2; i++) {
  const name = faker.fake("{{name.lastName}}, {{name.firstName}} {{name.suffix}}");
  const division = faker.random.arrayElement(divisions);
  users.push({
    'name': name,
    'division': division
  });
}

// register
Vue.component('app-sidebar', {
  template: '<div>A sidebar component!</div>'
})
Vue.component('app-content', {
  template: '<div>A content component!</div>'
})

new Vue({
  el: '#app',
  data: {
    users: users
  }
})