diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 0000000000000000000000000000000000000000..ec6d3cdd7f5b083403ae78073054bb0854c0227f
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1 @@
+package.json
diff --git a/package.json b/package.json
index afd2eec974adb0ae81144443b1f59da94cbeb019..8d71ed2bfe7541df34d17b52deabd74308020c52 100644
--- a/package.json
+++ b/package.json
@@ -5,8 +5,10 @@
   "license": "MPL-2.0",
   "scripts": {
     "dev": "webpack-dev-server --open --config webpack.dev.js",
-    "build": "webpack --config webpack.prod.js"
+    "build": "webpack --config webpack.prod.js",
+    "prettier": "prettier --write src/**/*.js"
   },
+  "pre-commit": ["prettier"],
   "dependencies": {
     "aframe-input-mapping-component": "https://github.com/fernandojsg/aframe-input-mapping-component",
     "aframe-teleport-controls": "https://github.com/netpro2k/aframe-teleport-controls#feature/teleport-origin",
@@ -21,6 +23,7 @@
     "babel-preset-env": "^1.6.1",
     "eslint-config-prettier": "^2.6.0",
     "eslint-plugin-prettier": "^2.3.1",
+    "pre-commit": "^1.2.2",
     "prettier": "^1.7.0",
     "webpack": "^3.6.0",
     "webpack-dev-server": "^2.9.3",
diff --git a/public/index.html b/public/index.html
index 4326c74b85a48ff039a33f869ff20b8f076f0233..6bcedf148c094a516dbc77f4d56c6e8f1e5f766b 100644
--- a/public/index.html
+++ b/public/index.html
@@ -7,14 +7,16 @@
 </head>
 
 <body>
-    <a-scene networked-scene="adapter: janus;
-                     room: 2;
-                     serverURL: wss://quander.me:8989;
-                     audio: true;
-                     debug: true;
-                     connectOnLoad: false" mute-mic="eventSrc: a-scene; toggleEvents: action_mute">
+    <a-scene networked-scene="
+            adapter: janus;
+            room: 2;
+            serverURL: wss://quander.me:8989;
+            audio: true;
+            debug: true;
+            connectOnLoad: false" mute-mic="eventSrc: a-scene; toggleEvents: action_mute">
+
         <a-assets>
-            <img id="grid" src="assets/grid.png" crossorigin="anonymous">
+            <img id="grid" src="assets/grid.png" crossorigin="anonymous" />
             <img id="sky" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg" crossorigin="anonymous" />
 
             <a-asset-item id="dodec-avatar-head" src="assets/avatars/dodec/DodecAvatarGLTF/DodecAvatar_Head.gltf"></a-asset-item>
@@ -25,29 +27,29 @@
 
             <!-- Templates -->
             <script id="head-template" type="text/html">
-        <a-entity
-            class="head"
-            gltf-model="#dodec-avatar-head"
-            networked-audio-source
-            networked-audio-analyser
-            matcolor-audio-feedback="objectName: DodecAvatar_Head_0"
-            scale-audio-feedback
-            avatar-customization
-        ></a-entity>
-      </script>
+                <a-entity
+                    class="head"
+                    gltf-model="#dodec-avatar-head"
+                    networked-audio-source
+                    networked-audio-analyser
+                    matcolor-audio-feedback="objectName: DodecAvatar_Head_0"
+                    scale-audio-feedback
+                    avatar-customization
+                ></a-entity>
+            </script>
 
             <script id="hand-template" type="text/html">
-        <a-box class="hand" scale="0.2 0.1 0.3"></a-box>
-      </script>
+                <a-box class="hand" scale="0.2 0.1 0.3"></a-box>
+            </script>
 
             <script id="nametag-template" type="text/html">
-        <a-entity
-            class="nametag"
-            nametag-transform="follow: .head"
-            text="side:double;align:center;color:#555"
-            position="0 2.5 0"
-            scale="6 6 6"></a-entity>
-      </script>
+                <a-entity
+                    class="nametag"
+                    nametag-transform="follow: .head"
+                    text="side:double;align:center;color:#555"
+                    position="0 2.5 0"
+                    scale="6 6 6"></a-entity>
+            </script>
         </a-assets>
 
         <a-entity id="player-rig" networked wasd-controls snap-rotation="pivotSrc: #head">
@@ -71,6 +73,7 @@
 
         <a-entity class="head" gltf-model="#rock-island" position="0 0 0">
             <a-sky color="#DDFFD9"></a-sky>
+        </a-entity>
     </a-scene>
     <script>
         document.querySelector('a-scene').addEventListener('loaded', onSceneLoad)
diff --git a/src/components/nametag-transform.js b/src/components/nametag-transform.js
index 9db4088c90d9d32baf7475b9a08fe61553200ae9..8ca578ea06ac25700822c54988408dfe46224318 100644
--- a/src/components/nametag-transform.js
+++ b/src/components/nametag-transform.js
@@ -1,19 +1,22 @@
 AFRAME.registerComponent("nametag-transform", {
   schema: {
-    follow: {type: "string"}
+    follow: { type: "string" }
   },
   init: function() {
     this.vector = new THREE.Vector3();
 
     // TODO this traversal kinda feels like a hack. Should probably change networked-aframe to support it properly.
     // traverse up to the networked player rig and find the networked head.
-    var head = this._findParent(this.el, '[networked]').parentNode.querySelector(this.data.follow);
+    var head = this._findParent(
+      this.el,
+      "[networked]"
+    ).parentNode.querySelector(this.data.follow);
     // traverse up to the head's networked parent and get its object3D
-    this.followObj = this._findParent(head, '[networked]').object3D;
+    this.followObj = this._findParent(head, "[networked]").object3D;
   },
-  _findParent: function (el, selector) {
+  _findParent: function(el, selector) {
     var parent = el.parentNode;
-    while(parent && !parent.matches(selector)) {
+    while (parent && !parent.matches(selector)) {
       parent = parent.parentNode;
     }
     return parent;
diff --git a/src/index.js b/src/index.js
index 179651be3d219a7bd85d18046bcf80d726673ec3..fabb513a4751cda114a9ed2d5d30d8c6403f42d6 100644
--- a/src/index.js
+++ b/src/index.js
@@ -61,5 +61,3 @@ window.onSceneLoad = function() {
 
   document.querySelector("a-scene").components["networked-scene"].connect();
 };
-
-
diff --git a/yarn.lock b/yarn.lock
index 0d5898ca05f9aa0140aca001f9f8655f1f41ba92..3608d9e26071cf6a8d1c9b8a142dd022d8004386 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1216,6 +1216,14 @@ concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
 
+concat-stream@^1.4.7:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.0.tgz#0aac662fd52be78964d5532f694784e70110acf7"
+  dependencies:
+    inherits "^2.0.3"
+    readable-stream "^2.2.2"
+    typedarray "^0.0.6"
+
 connect-history-api-fallback@^1.3.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.4.0.tgz#3db24f973f4b923b0e82f619ce0df02411ca623d"
@@ -2919,6 +2927,10 @@ os-locale@^2.0.0:
     lcid "^1.0.0"
     mem "^1.1.0"
 
+os-shim@^0.1.2:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/os-shim/-/os-shim-0.1.3.tgz#6b62c3791cf7909ea35ed46e17658bb417cb3917"
+
 os-tmpdir@^1.0.0, os-tmpdir@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
@@ -3093,6 +3105,14 @@ portfinder@^1.0.9:
     debug "^2.2.0"
     mkdirp "0.5.x"
 
+pre-commit@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/pre-commit/-/pre-commit-1.2.2.tgz#dbcee0ee9de7235e57f79c56d7ce94641a69eec6"
+  dependencies:
+    cross-spawn "^5.0.1"
+    spawn-sync "^1.0.15"
+    which "1.2.x"
+
 preserve@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
@@ -3235,7 +3255,7 @@ read-pkg@^2.0.0:
     normalize-package-data "^2.3.2"
     path-type "^2.0.0"
 
-readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.4, readable-stream@^2.2.6, readable-stream@^2.2.9:
+readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.0.6, readable-stream@^2.1.4, readable-stream@^2.2.2, readable-stream@^2.2.6, readable-stream@^2.2.9:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.3.tgz#368f2512d79f9d46fdfc71349ae7878bbc1eb95c"
   dependencies:
@@ -3573,6 +3593,13 @@ source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.1, source-map@~0.5.3:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
+spawn-sync@^1.0.15:
+  version "1.0.15"
+  resolved "https://registry.yarnpkg.com/spawn-sync/-/spawn-sync-1.0.15.tgz#b00799557eb7fb0c8376c29d44e8a1ea67e57476"
+  dependencies:
+    concat-stream "^1.4.7"
+    os-shim "^0.1.2"
+
 spdx-correct@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40"
@@ -3806,6 +3833,10 @@ type-is@~1.6.15:
     media-typer "0.3.0"
     mime-types "~2.1.15"
 
+typedarray@^0.0.6:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
+
 uglify-js@^2.8.29:
   version "2.8.29"
   resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-2.8.29.tgz#29c5733148057bb4e1f75df35b7a9cb72e6a59dd"
@@ -4025,6 +4056,12 @@ which-module@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
 
+which@1.2.x:
+  version "1.2.14"
+  resolved "https://registry.yarnpkg.com/which/-/which-1.2.14.tgz#9a87c4378f03e827cecaf1acdf56c736c01c14e5"
+  dependencies:
+    isexe "^2.0.0"
+
 which@^1.2.9:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.0.tgz#ff04bdfc010ee547d780bec38e1ac1c2777d253a"