diff --git a/API.md b/API.md
index ddfd20c..d376d07 100644
--- a/API.md
+++ b/API.md
@@ -17,6 +17,8 @@ A PID is a string chosen by the publisher and cannot be longer than 16 character
 
 All API requests must be issued with one special parameter `version` denoting the expected version of the API as  a string, e.g. `1.0` (see examples below). You should always put the version of this document as a `version` parameter.
 
+Once you obtained your PSK, you can test the API [here](/api-test.html).
+
 ## <a name="registration"></a>NoteHub API Access Request
 To register as a publisher and gain access to NoteHub API, please [send](mailto:notehub@icloud.com?subject=NoteHub API Access Request&body=Please add [a] desired PID as a 16 char string [b] your contact information, [c] short usage explanation and [d] the URL of the resource or it's website.) an email with the following information about you: the desired PID, your contact information, a short description of what you want to do and an URL of the resource where the API will be used or its website.
 
diff --git a/LANDING.md b/LANDING.md
index 4aba518..24a6a7b 100644
--- a/LANDING.md
+++ b/LANDING.md
@@ -16,6 +16,7 @@ Send your feedback and comments directly to [@gravitydenier](http://twitter.com/
 - **API**: Integrate the publishing functionality into your editor using the official [NoteHub API](/api).
 
 ## Changelog
+ - Februare 2014: a simple JS-client for API testing [added](/api-test.html).
  - January 2014:
    - Mobile friendly styling added.
    - NoteHub API [introduced](/api).
diff --git a/resources/public/api-test.html b/resources/public/api-test.html
new file mode 100644
index 0000000..87bf376
--- /dev/null
+++ b/resources/public/api-test.html
@@ -0,0 +1,121 @@
+<!DOCTYPE html>
+<html>
+<head>
+<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet">
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+<title>NoteHub API Testing</title>
+<meta charset="UTF-8">
+</head>
+<body>
+<script>
+    function request(type, data) {
+        $("#request").text(JSON.stringify(data));
+        $.ajax({
+            type: type,
+            dataType: 'json',
+            url: "/api/note",
+            data: data,
+            success: function(result){
+                $("#response").text(JSON.stringify(result));
+            }
+        });
+    }
+    function selectForm(name) {
+        ["#get", "#post", "#update"].forEach(function(elem){
+            if(name==elem) {
+                $(elem + "-form").show();
+                $(elem + "-li").addClass("active");
+            } else { 
+                $(elem + "-form").hide()
+            $(elem + "-li").removeClass("active");
+            }
+        });
+    }
+    function getNote(){
+        var data = {
+            noteID: $("#get-noteID").val(),
+            version: $("#version").val()
+        };
+        request("GET", data);
+    }
+    function postNote(){
+        var data = {
+            note: $("#post-note").val(),
+            pid: $("#pid").val(),
+            signature: $("#post-signature").val(),
+            password: $("#post-password").val(),
+            version: $("#version").val()
+        };
+        request("POST", data);
+    }
+    function updateNote(){
+        var data = {
+            noteID: $("#update-noteID").val(),
+            note: $("#update-note").val(),
+            pid: $("#pid").val(),
+            signature: $("#update-signature").val(),
+            password: $("#update-password").val(),
+            version: $("#version").val()
+        };
+        request("PUT", data);
+    }
+</script>
+<div class="container">
+    <div class="page-header">
+        <h1>NoteHub API Testing</h1>
+    </div>
+    <label>PID</label>
+    <input id="pid" type="text">
+    <label>PSK</label>
+    <input id="psk" type="text">
+    <label>API version</label>
+    <input id="version" type="text" value="1.3">
+    <br/>
+    <ul class="nav nav-tabs">
+        <li id="get-li" class="active"><a href="javascript:selectForm('#get')">Get Note</a></li>
+        <li id="post-li"><a href="javascript:selectForm('#post')">Post Note</a></li>
+        <li id="update-li"><a href="javascript:selectForm('#update')">Update Note</a></li>
+    </ul>
+    <form id="get-form">
+        <fieldset>
+            <label>noteID</label>
+            <input id="get-noteID" type="text" value="2014/1/3/lorem-ipsum">
+            <br/>
+            <a href="javascript:getNote()" class="btn">Submit</a>
+        </fieldset>
+    </form>
+    <form id="post-form" style="display: none;">
+        <fieldset>
+            <label>note</label>
+            <textarea id="post-note"></textarea>
+            <label>signature (md5 hash of pid + psk + note)</label>
+            <input id="post-signature" type="text" value="">
+            <label>password</label>
+            <input id="post-password" type="text" value="">
+            <br/>
+            <a href="javascript:postNote()" class="btn">Submit</a>
+        </fieldset>
+    </form>
+    <form id="update-form" style="display: none;">
+        <fieldset>
+            <label>noteID</label>
+            <input id="update-noteID" type="text" value="">
+            <label>note</label>
+            <textarea id="update-note"></textarea>
+            <label>password</label>
+            <input id="update-password" type="text" value="">
+            <label>signature (md5 of pid + psk + noteID + note + password)</label>
+            <input id="update-signature" type="text" value="">
+            <br/>
+            <a href="javascript:updateNote()" class="btn">Submit</a>
+        </fieldset>
+    </form>
+    <h4>Request</h4>
+    <pre id="request" class="prettyprint linenums">
+    </pre>
+    <h4>Response</h4>
+    <pre id="response" class="prettyprint linenums">
+    </pre>
+</div>
+</body>
+</html>
diff --git a/src/notehub/handler.clj b/src/notehub/handler.clj
index a8b2a86..b4e29b6 100644
--- a/src/notehub/handler.clj
+++ b/src/notehub/handler.clj
@@ -89,9 +89,6 @@
    :body content})
 
 (defroutes api-routes
-  (GET "/" [] (layout (get-message :api-title)
-                      (md-node :article (slurp "API.md"))))
-
   (GET "/note" {params :params}
        (generate-string (api/version-manager api/get-note params)))
 
@@ -102,7 +99,11 @@
        (generate-string (api/version-manager api/update-note params))))
 
 (defroutes app-routes
-  (context "/api" [] api-routes)
+  (GET "/api" [] (layout (get-message :api-title)
+                      (md-node :article (slurp "API.md"))))
+
+  (context "/api" []
+           #(ring.util.response/content-type (api-routes %) "application/json"))
 
   (GET "/" []
        (layout (get-message :page-title)
