diff --git a/src/person.js b/src/person.js
index 49b1b03..6d9d2c3 100755
--- a/src/person.js
+++ b/src/person.js
@@ -2,6 +2,7 @@
 export const PERSON = {
   name: {
     first: 'John',
+    middle: '',
     last: 'Doe',
   },
   position: 'Software Developer',
diff --git a/src/resumes/left-right.vue b/src/resumes/left-right.vue
index d533084..91c0b6f 100755
--- a/src/resumes/left-right.vue
+++ b/src/resumes/left-right.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="resume" id="resume1">
   <div class="row text-center">
-    <span class="name">{{person.name.first}}  {{person.name.last}}</span>
+    <span class="name">{{person.name.first}} {{person.name.middle}} {{person.name.last}}</span>
   </div>
   <div class="row text-center">
     <p class="position center">{{person.position}}</p>
diff --git a/src/resumes/material-dark.vue b/src/resumes/material-dark.vue
index 2693f86..ce46b5d 100755
--- a/src/resumes/material-dark.vue
+++ b/src/resumes/material-dark.vue
@@ -94,7 +94,7 @@
 
   <div class="rightCol">
     <div class="title">
-      <h2>{{person.name.first}}  {{person.name.last}}</h2>
+      <h2>{{person.name.first}} {{person.name.middle}} {{person.name.last}}</h2>
       <div>{{person.position}}</div>
     </div>
 
diff --git a/src/resumes/oblique.vue b/src/resumes/oblique.vue
index 9a80969..fb0154a 100755
--- a/src/resumes/oblique.vue
+++ b/src/resumes/oblique.vue
@@ -5,7 +5,7 @@
     <div class="person-header">
       <div class="person-wrapper">
         <div class="person">
-          <div class="name">{{person.name.first}} {{person.name.last}}</div>
+          <div class="name">{{person.name.first}} {{person.name.middle}} {{person.name.last}}</div>
           <div class="position">{{person.position}}</div>
         </div>
         <div class="img">
diff --git a/src/resumes/side-bar.vue b/src/resumes/side-bar.vue
index ab96996..879db71 100755
--- a/src/resumes/side-bar.vue
+++ b/src/resumes/side-bar.vue
@@ -1,8 +1,12 @@
 <template>
   <div id="resume2" class="resume">
       <div class="top-row">
-          <span class="person-name">  {{person.name.first}}  {{person.name.last}}    </span>
-          <span class="person-position">  {{person.position}}    </span>
+          <span class="person-name">
+            {{person.name.first}} {{person.name.middle}} {{person.name.last}}
+          </span>
+          <span class="person-position">
+            {{person.position}}
+          </span>
       </div>
       <div class="left-col">
           <div class="person-image">
diff --git a/src/resumes/template.vue b/src/resumes/template.vue
index bddaf91..029c07d 100644
--- a/src/resumes/template.vue
+++ b/src/resumes/template.vue
@@ -5,9 +5,7 @@
 </template>
 
 <script>
-import {
-  PERSON
-} from '../person';
+import { PERSON as person } from '../person';
 
 import Vue from 'vue';
 // TODO rename vue component
@@ -15,7 +13,7 @@ export default Vue.component('template', {
   name: 'template',
   data () {
     return {
-      person: PERSON
+      person
     };
   }
 });