diff --git a/public/output/clickable-text.js b/public/output/clickable-text.js
new file mode 100644
index 0000000..0236936
--- /dev/null
+++ b/public/output/clickable-text.js
@@ -0,0 +1,10 @@
+import WebComponent from "https://unpkg.com/web-component-base/index.js";
+
+export default class ClickableText extends WebComponent {
+  onInit() {
+    this.onclick = () => alert("Thank you for clicking the text!");
+  }
+  get template() {
+    return `<span style="cursor:pointer">Click me too!</span>`;
+  }
+}
diff --git a/public/output/hello-world.js b/public/output/hello-world.js
new file mode 100644
index 0000000..23b7556
--- /dev/null
+++ b/public/output/hello-world.js
@@ -0,0 +1,24 @@
+import WebComponent from "https://unpkg.com/web-component-base/index.js";
+
+export default class HelloWorld extends WebComponent {
+  name = "";
+  static properties = ["name"];
+
+  onInit() {
+    console.log(`Greeting for ${this.name} initialized`);
+    let count = 0;
+    this.onclick = () => {
+      console.log("Clicked!");
+      this.setAttribute("name", `I was clicked ${++count} times`);
+    };
+    this.setAttribute("title", "Click me please");
+  }
+
+  onChanges(changes) {
+    console.log(changes);
+  }
+
+  get template() {
+    return `<button style="cursor:pointer">Hello ${this.name}!</button>`;
+  }
+}
diff --git a/public/output/registry.js b/public/output/registry.js
new file mode 100644
index 0000000..5ec9de6
--- /dev/null
+++ b/public/output/registry.js
@@ -0,0 +1,2 @@
+import C0 from "./clickable-text.js";import C1 from "./hello-world.js";const registry = {
+    "clickable-text": C0,"hello-world": C1};Object.keys(registry).forEach((key) => {if(window?.hasOwnProperty("customElements"))customElements.define(key, registry[key]);})
\ No newline at end of file