index.html

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>Vue Template</title>
	<link href="style.css" rel="stylesheet" type="text/css" />

  <script src="https://unpkg.com/vue@next"></script>

</head>

<body>
	<h1>Build An Interactive To Do List</h1>

  <div id="todo-list">
    <form v-on:submit.prevent="addNewTask">
      <label for="task-input">Add a new task</label>
      <input 
        v-model="newTask"
        id="task-input" 
        placeholder="Eg. Watch Vue course"
      />
      <button >Submit</button>
    </form>
    <ul>
      <todo-item
        v-for="(task, index) in tasks"
        :key="task.id"
        :title="task.title"
        @remove="tasks.splice(index, 1)"
      >
      </todo-item>
    </ul>

  </div>

 	<script src="script.js">
	</script>
</body>

</html>