diff --git a/qlfile b/qlfile
index 2f0ba9c..052a4e6 100644
--- a/qlfile
+++ b/qlfile
@@ -9,3 +9,4 @@ ql clack-errors
 git microcms https://github.com/skyizwhite/microcms-lisp-sdk
 ql local-time
 ql function-cache
+ql jonathan
diff --git a/qlfile.lock b/qlfile.lock
index f41858f..bcfc50c 100644
--- a/qlfile.lock
+++ b/qlfile.lock
@@ -46,3 +46,7 @@
  (:class qlot/source/ql:source-ql
   :initargs (:%version :latest)
   :version "ql-2023-10-21"))
+("jonathan" .
+ (:class qlot/source/ql:source-ql
+  :initargs (:%version :latest)
+  :version "ql-2020-09-25"))
diff --git a/src/helper.lisp b/src/helper.lisp
new file mode 100644
index 0000000..4732e38
--- /dev/null
+++ b/src/helper.lisp
@@ -0,0 +1,12 @@
+(defpackage #:website/helper
+  (:use #:cl
+        #:jingle)
+  (:export #:api-p))
+(in-package #:website/helper)
+
+(defun starts-with-p (prefix string)
+  (let ((pos (search prefix string :start1 0 :end1 (length prefix) :start2 0)))
+    (and pos (= pos 0))))
+
+(defun api-p ()
+  (starts-with-p "/api/" (request-uri *request*)))
diff --git a/src/renderer.lisp b/src/renderer.lisp
index 80fd48b..c3b2d28 100644
--- a/src/renderer.lisp
+++ b/src/renderer.lisp
@@ -1,7 +1,9 @@
 (defpackage #:website/renderer
   (:use #:cl
         #:hsx
-        #:jingle)
+        #:jingle
+        #:website/helper
+        #:jonathan)
   (:import-from #:hsx/element
                 #:element)
   (:import-from #:website/components/metadata
@@ -13,17 +15,21 @@
 (in-package #:website/renderer)
 
 (defmethod jingle:process-response :around ((app jingle:app) result)
-  (set-response-header :content-type "text/html; charset=utf-8")
   (when (eq (request-method *request*) :get)
     (set-response-header :cache-control "public, max-age=60"))
-  (call-next-method app
-                    (render-to-string
-                     (hsx (html :lang "ja"
-                            (head
-                              (~metadata :metadata (context :metadata))
-                              (~scripts))
-                            (body
-                              :hx-ext "head-support, response-targets, preload"
-                              :hx-boost "true" :hx-swap "transition:true"
-                              :hx-target-404 "body" :hx-target-5* "body"
-                              (~layout result)))))))
+  (cond ((api-p)
+         (set-response-header :content-type "application/json; charset=utf-8") 
+         (call-next-method app (to-json result)))
+        (t
+         (set-response-header :content-type "text/html; charset=utf-8")
+         (call-next-method app
+                           (render-to-string
+                            (hsx (html :lang "ja"
+                                   (head
+                                     (~metadata :metadata (context :metadata))
+                                     (~scripts))
+                                   (body
+                                     :hx-ext "head-support, response-targets, preload"
+                                     :hx-boost "true" :hx-swap "transition:true"
+                                     :hx-target-404 "body" :hx-target-5* "body"
+                                     (~layout result)))))))))
diff --git a/src/routes/not-found.lisp b/src/routes/not-found.lisp
index b2caaad..0715ff8 100644
--- a/src/routes/not-found.lisp
+++ b/src/routes/not-found.lisp
@@ -1,7 +1,8 @@
 (defpackage #:website/routes/not-found
   (:use #:cl
         #:hsx
-        #:jingle)
+        #:jingle
+        #:website/helper)
   (:export #:handle-not-found))
 (in-package #:website/routes/not-found)
 
@@ -12,9 +13,11 @@
 
 (defun handle-not-found ()
   (setf (context :metadata) *metadata*)
-  (hsx
-   (div :class "flex flex-col h-full items-center justify-center gap-y-6"
-     (h1 :class "font-bold text-2xl"
-       "404 Not Found")
-     (a :href "/" :class "text-lg text-pink-500 hover:underline"
-       "Back to TOP"))))
+  (if (api-p)
+      '(:|message| "404 Not Found")
+      (hsx
+       (div :class "flex flex-col h-full items-center justify-center gap-y-6"
+         (h1 :class "font-bold text-2xl"
+           "404 Not Found")
+         (a :href "/" :class "text-lg text-pink-500 hover:underline"
+           "Back to TOP")))))