JSFiddle - React, Tailwind, and code Playground

by Bo Andersen

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <h1>Employees</h1>
  
  <table border="1">
    <thead>
      <tr>
        <td>Name</td>
        <td>Title</td>
        <td>Company</td>
      </tr>
    </thead>
    <tbody>
      <tr v-for="(employee, index) in employees">
        <td>{{ employee.name }}</td>
        <td>{{ employee.title }}</td>
        <td>{{ companyName }}</td>
      </tr>
    </tbody>
  </table>
</div>

JavaScript

new Vue({
	el: '#app',
  data: {
		employees: [
    	{ name: 'Abby', title: 'Accountant' },
      { name: 'Andy', title: 'Marketing Manager' },
      { name: 'Brandon', title: 'Vue.js Expert' }
    ],
    companyName: 'VueX Ltd.'
  }
});