diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3c3629e
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/.prettierrc.js b/.prettierrc.js
new file mode 100644
index 0000000..162453b
--- /dev/null
+++ b/.prettierrc.js
@@ -0,0 +1,5 @@
+module.exports = {
+  tabWidth: 2,
+  semi: false,
+  singleQuote: true,
+};
diff --git a/src/App.vue b/src/App.vue
new file mode 100644
index 0000000..8ea42c9
--- /dev/null
+++ b/src/App.vue
@@ -0,0 +1,14 @@
+<template>
+  <div id="app">
+    <NoteList />
+  </div>
+</template>
+
+<script>
+import NoteList from '@/components/NoteList.vue'
+export default {
+  components: {
+    NoteList
+  }
+}
+</script>
diff --git a/src/components/NoteList.vue b/src/components/NoteList.vue
new file mode 100644
index 0000000..9ede577
--- /dev/null
+++ b/src/components/NoteList.vue
@@ -0,0 +1,31 @@
+<template>
+  <textarea
+    @keyup.enter="addNote"
+    v-model="content"
+    cols="30"
+    rows="10"
+  ></textarea>
+  <button type="submit" @click="addNote">
+    Submit
+  </button>
+  <div v-for="note in notes" :key="note.id">{{ note.text }}</div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      notes: [{ id: 1, text: 'This is a note' }],
+      content: 'Start typing something…'
+    }
+  },
+  methods: {
+    addNote() {
+      this.notes.push({ id: 2, text: this.content })
+      this.content = ''
+    }
+  }
+}
+</script>
+
+<style></style>
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..64951b0
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,4 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+
+const mounted = createApp(App).mount('#app') // eslint-disable-line