Add alpinejs frontend

2024-06-20 20:16:27 -04:00 · 2024-06-20 20:16:27 -04:00 · f9ba02a160
commit f9ba02a160
parent 4281b244dd
1 changed files with 23 additions and 0 deletions
--- a/alpinejs/index.html
+++ b/alpinejs/index.html
@ -0,0 +1,23 @@
+<html>
+<head>
+    <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
+</head>
+  <body x-data="{
+    blurb_data: {
+      title: 'Fart Man Comes To Town!',
+      blurb: 'Will this controversial figure finally cause the downfall of the town? Sally Smith from town center says that she can already smell trouble brewing but other members of the town believe the imminent winds of change will revitalize the towns central business district.'
+    }
+  }">
+    <div x-data="{blurbs: [blurb_data]}">
+      <template x-for="blurb in blurbs">
+        <div>
+          <h1 x-text="blurb.title"></h1>
+          <p x-text="blurb.blurb"></p>
+          <a href="#">Read more...</a>
+        </div>
+      </template>
+      <br />
+      <button x-on:click="blurbs.push(blurb_data)">Load More</button>
+    </div>
+</body>
+</html>