JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.4/css/bulma.min.css">
<div class="columns" id="app">
    <div class="column is-two-thirds">
      <section class="section">
        <h1 class="title">Fun with Forms in Vue 2.0</h1>
        <p class="subtitle">
          Learn how to work with forms, including <strong>validation</strong>!
        </p>
        <hr>      
        
        <!-- form starts here -->
        <section class="form">
          <div class="field">
            <label class="label">Name</label>
            <div class="control">
              <input v-model="form.name" class="input" type="text" placeholder="Text input">
            </div>
          </div>
        </section>
      </section>
    </div>
    
    <div class="column">
      <section class="section" id="results">
        <div class="box">
          <ul>          
            <!-- loop through all the `form` properties and show their values -->
            <li v-for="(item, k) in form">
              <strong>{{ k }}:</strong> {{ item }}
            </li>
          </ul>
        </div>
      </section>
    </div>
  </div>

JavaScript

new Vue({
  el: '#app',
  data: {
    form : {
      name: ''
    }
  }
});