diff --git a/assets/public/js/.jsbeautifyrc b/assets/public/js/.jsbeautifyrc
new file mode 100644
index 00000000..3077c481
--- /dev/null
+++ b/assets/public/js/.jsbeautifyrc
@@ -0,0 +1,32 @@
+{
+  "js": {
+    "allowed_file_extensions": ["js", "json", "jshintrc", "jsbeautifyrc"],
+
+    // Set brace_style
+    //  collapse: (old default) Put braces on the same line as control statements
+    //  collapse-preserve-inline: (new default) Same as collapse but better support for ES6 destructuring and other features. https://github.com/victorporof/Sublime-HTMLPrettify/issues/231
+    //  expand: Put braces on own line (Allman / ANSI style)
+    //  end-expand: Put end braces on own line
+    //  none: Keep them where they are
+    "brace_style": "collapse-preserve-inline",
+
+    "break_chained_methods": false, // Break chained method calls across subsequent lines
+    "e4x": false, // Pass E4X xml literals through untouched
+    "end_with_newline": false, // End output with newline
+    "indent_char": " ", // Indentation character
+    "indent_level": 0, // Initial indentation level
+    "indent_size": 4, // Indentation size
+    "indent_with_tabs": false, // Indent with tabs, overrides `indent_size` and `indent_char`
+    "jslint_happy": false, // If true, then jslint-stricter mode is enforced
+    "keep_array_indentation": false, // Preserve array indentation
+    "keep_function_indentation": false, // Preserve function indentation
+    "max_preserve_newlines": 0, // Maximum number of line breaks to be preserved in one chunk (0 disables)
+    "preserve_newlines": true, // Whether existing line breaks should be preserved
+    "space_after_anon_function": false, // Should the space before an anonymous function's parens be added, "function()" vs "function ()"
+    "space_before_conditional": true, // Should the space before conditional statement be added, "if(true)" vs "if (true)"
+    "space_in_empty_paren": false, // Add padding spaces within empty paren, "f()" vs "f( )"
+    "space_in_paren": false, // Add padding spaces within paren, ie. f( a, b )
+    "unescape_strings": false, // Should printable characters in strings encoded in \xNN notation be unescaped, "example" vs "\x65\x78\x61\x6d\x70\x6c\x65"
+    "wrap_line_length": 0 // Lines should wrap at next opportunity after this number of characters (0 disables)
+  }
+}
diff --git a/assets/public/js/application.js b/assets/public/js/application.js
index a3673b85..59f121b3 100644
--- a/assets/public/js/application.js
+++ b/assets/public/js/application.js
@@ -1,20 +1,58 @@
 'use strict';
 
 document.addEventListener('DOMContentLoaded', event => {
-	document.getElementById('logout').insertAdjacentHTML('beforebegin', `<a href="/admin/settings/">
+    document.getElementById('logout').insertAdjacentHTML('beforebegin', `<a href="/admin/settings/">
       <div class="action">
        <i class="material-icons">settings</i>
       </div>
      </a>`);
 });
 
-
 document.addEventListener('listing', event => {
-	document.getElementById('newdir').placeholder = "file[:archetype]...";
+    if (window.location.pathname.includes('/content/')) {
+        document.getElementById('newdir').placeholder = "file[:archetype]...";
+        document.getElementById('newdir').removeEventListener('keydown', newDirEvent);
+        document.getElementById('newdir').addEventListener('keydown', event => {
+
+            if (event.keyCode == 27) {
+                document.getElementById('newdir').classList.toggle('enabled');
+                setTimeout(() => {
+                    document.getElementById('newdir').value = '';
+                }, 200);
+            }
+
+            if (event.keyCode == 13) {
+                event.preventDefault();
+
+                let value = document.getElementById('newdir').value;
+                let index = value.lastIndexOf(':');
+                let name = value.substring(0, index);
+                let archetype = value.substring(index + 1, value.length);
+                if (name == "") name = archetype;
+                if (index == -1) archetype = "";
+
+                let button = document.getElementById('new');
+                let html = button.changeToLoading();
+                let request = new XMLHttpRequest();
+                request.open("POST", window.location);
+                request.setRequestHeader('Filename', name);
+                request.setRequestHeader('Archetype', archetype);
+                request.send();
+                request.onreadystatechange = function() {
+                    if (request.readyState == 4) {
+                        button.changeToDone((request.status != 200), html);
+                        if (request.status == 200) {
+                            window.location = window.location.pathname + name;
+                        }
+                    }
+                }
+            }
+        });
+    }
 });
 
 document.addEventListener('editor', event => {
-	document.getElementById('submit').insertAdjacentHTML('afterend', `<div class="right">
+    document.getElementById('submit').insertAdjacentHTML('afterend', `<div class="right">
 	 <button id="publish">
 		 <span>
 			<i class="material-icons">send</i>
@@ -23,41 +61,41 @@ document.addEventListener('editor', event => {
 	 </button>
 	 </div>`);
 
-	if (document.getElementById('date') || document.getElementById('publishdate')) {
-		document.querySelector('#editor .right').insertAdjacentHTML('afterbegin', ` <button id="schedule">
+    if (document.getElementById('date') || document.getElementById('publishdate')) {
+        document.querySelector('#editor .right').insertAdjacentHTML('afterbegin', ` <button id="schedule">
 			  <span>
 				 <i class="material-icons">alarm</i>
 			  </span>
 			  <span>Schedule</span>
 		  </button>`);
 
-		document.getElementById('schedule').addEventListener('click', event => {
-			event.preventDefault();
-		});
-	}
+        document.getElementById('schedule').addEventListener('click', event => {
+            event.preventDefault();
+        });
+    }
 
-	document.getElementById('publish').addEventListener('click', event => {
-		console.log("Hey")
-		event.preventDefault();
+    document.getElementById('publish').addEventListener('click', event => {
+        console.log("Hey")
+        event.preventDefault();
 
-		if (document.getElementById('draft')) {
-			document.getElementById('block-draft').remove();
-		}
-		let container = document.getElementById('editor');
-		let kind = container.dataset.kind;
-		let button = document.querySelector('#publish span:first-child');
+        if (document.getElementById('draft')) {
+            document.getElementById('block-draft').remove();
+        }
+        let container = document.getElementById('editor');
+        let kind = container.dataset.kind;
+        let button = document.querySelector('#publish span:first-child');
 
-		let data = form2js(document.querySelector('form'));
-		let html = button.changeToLoading();
-		let request = new XMLHttpRequest();
-		request.open("PUT", window.location);
-		request.setRequestHeader('Kind', kind);
-		request.setRequestHeader('Regenerate', "true");
-		request.send(JSON.stringify(data));
-		request.onreadystatechange = function() {
-			if (request.readyState == 4) {
-				button.changeToDone((request.status != 200), html);
-			}
-		}
-	});
-});
+        let data = form2js(document.querySelector('form'));
+        let html = button.changeToLoading();
+        let request = new XMLHttpRequest();
+        request.open("PUT", window.location);
+        request.setRequestHeader('Kind', kind);
+        request.setRequestHeader('Regenerate', "true");
+        request.send(JSON.stringify(data));
+        request.onreadystatechange = function() {
+            if (request.readyState == 4) {
+                button.changeToDone((request.status != 200), html);
+            }
+        }
+    });
+});
\ No newline at end of file
diff --git a/hugo.go b/hugo.go
index 57dacede..32ee8eda 100644
--- a/hugo.go
+++ b/hugo.go
@@ -67,8 +67,23 @@ func (h Hugo) ServeHTTP(w http.ResponseWriter, r *http.Request) (int, error) {
 		}
 
 		if r.Method == http.MethodPost && r.Header.Get("archetype") != "" {
-			// TODO: this
-			return 0, nil
+			filename := r.Header.Get("Filename")
+			archetype := r.Header.Get("archetype")
+
+			if !strings.HasSuffix(filename, ".md") && !strings.HasSuffix(filename, ".markdown") {
+				return h.FileManager.ServeHTTP(w, r)
+			}
+
+			filename = strings.Replace(r.URL.Path, h.Config.BaseURL+"/content/", "", 1) + filename
+			filename = filepath.Clean(filename)
+
+			args := []string{"new", filename, "--kind", archetype}
+
+			if err := commands.Run(h.Config.Hugo, args, h.Config.Root); err != nil {
+				return http.StatusInternalServerError, err
+			}
+
+			return http.StatusOK, nil
 		}
 
 		if directory.CanBeEdited(r.URL.Path) && r.Method == http.MethodPut {
diff --git a/utils/commands/commands.go b/utils/commands/commands.go
index 2e8626d4..36418f60 100644
--- a/utils/commands/commands.go
+++ b/utils/commands/commands.go
@@ -9,7 +9,7 @@ import (
 func Run(command string, args []string, path string) error {
 	cmd := exec.Command(command, args...)
 	cmd.Dir = path
-	cmd.Stdout = os.Stderr
+	cmd.Stdout = os.Stdout
 	cmd.Stderr = os.Stderr
 	return cmd.Run()
 }