diff --git a/routes/[...index].ts b/routes/[...index].ts
index a3ec3b8..fe7dc74 100644
--- a/routes/[...index].ts
+++ b/routes/[...index].ts
@@ -20,7 +20,7 @@ export default eventHandler(async (event) => {
     }
   }
 
-  if (!!componentType) {
+  if (!!componentType && !!html) {
     html = await insertRegistry(html.toString(), componentType);
   }
 
diff --git a/src/pages/about.html b/src/pages/demo/about.html
similarity index 100%
rename from src/pages/about.html
rename to src/pages/demo/about.html
diff --git a/src/pages/about/index.html b/src/pages/demo/about/index.html
similarity index 100%
rename from src/pages/about/index.html
rename to src/pages/demo/about/index.html
diff --git a/src/pages/about/me.html b/src/pages/demo/about/me.html
similarity index 100%
rename from src/pages/about/me.html
rename to src/pages/demo/about/me.html
diff --git a/src/pages/demo/index.html b/src/pages/demo/index.html
new file mode 100644
index 0000000..cbbca10
--- /dev/null
+++ b/src/pages/demo/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Hello {{name}} :)</title>
+    <script server:setup>
+      const name = "AYOs";
+      let greeting = "hello";
+      var count = sum(1, 247);
+
+      // comment
+
+      greeting = "nope";
+
+      function sum(x, y) {
+        return x + y;
+      }
+    </script>
+  </head>
+  <body>
+    <a href="/about">{{ count }}</a>
+    <div>
+      <hello-world name="{{name }}"></hello-world>
+    </div>
+    <p>some text: {{greeting}}</p>
+    {{greeting}} hey<br />
+    <clickable-text></clickable-text>
+    <script>
+      const helloWorld = document.querySelector("hello-world");
+      setTimeout(() => {
+        helloWorld.setAttribute("name", "Nitro");
+      }, 2000);
+    </script>
+  </body>
+</html>
diff --git a/src/pages/index.html b/src/pages/index.html
index cbbca10..cd14dc3 100644
--- a/src/pages/index.html
+++ b/src/pages/index.html
@@ -3,34 +3,10 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Hello {{name}} :)</title>
-    <script server:setup>
-      const name = "AYOs";
-      let greeting = "hello";
-      var count = sum(1, 247);
-
-      // comment
-
-      greeting = "nope";
-
-      function sum(x, y) {
-        return x + y;
-      }
-    </script>
+    <title>McFly: Back to the Basics. Into the Future.</title>
   </head>
   <body>
-    <a href="/about">{{ count }}</a>
-    <div>
-      <hello-world name="{{name }}"></hello-world>
-    </div>
-    <p>some text: {{greeting}}</p>
-    {{greeting}} hey<br />
-    <clickable-text></clickable-text>
-    <script>
-      const helloWorld = document.querySelector("hello-world");
-      setTimeout(() => {
-        helloWorld.setAttribute("name", "Nitro");
-      }, 2000);
-    </script>
+    <h1>McFly</h1>
+    <a href="/demo">Demo</a>
   </body>
 </html>
