feat: add htmx demo

tombrereton · Jan 10, 2024 · 46ef0bb · 46ef0bb
1 parent 054528a
commit 46ef0bb
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 0 deletions.
diff --git a/internal/routes/htmx.go b/internal/routes/htmx.go
@@ -0,0 +1,21 @@
+package routes
+
+import (
+	"html/template"
+	"net/http"
+
+	"github.com/go-chi/chi/v5"
+)
+
+func Htmx(t *template.Template) *chi.Mux {
+	r := chi.NewRouter()
+
+	r.Get("/", func(w http.ResponseWriter, r *http.Request) {
+		err := t.ExecuteTemplate(w, "htmx-demo.html", nil)
+		if err != nil {
+			http.Error(w, err.Error(), http.StatusInternalServerError)
+		}
+	})
+
+	return r
+}
diff --git a/internal/server/server.go b/internal/server/server.go
@@ -47,6 +47,7 @@ func (s *Server) MountMiddleware() {
 func (s *Server) MountPageHandlers() {
 	s.Router.NotFound(routes.NotFound(s.Templates))
 	s.Router.Mount("/", routes.LandingPage(s.Templates))
+	s.Router.Mount("/clicked", routes.Htmx(s.Templates))
 }
 
 func (s *Server) MountStaticFiles() {

diff --git a/templates/htmx-demo.html b/templates/htmx-demo.html
@@ -0,0 +1,3 @@
+{{ define "htmx-demo.html" }}
+<p class="text-slate-500 text-lg">Who needs SPA</p>
+{{ end }}
diff --git a/templates/landing.html b/templates/landing.html
@@ -6,12 +6,17 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link href="/static/css/styles.css" rel="stylesheet">
+    <script src="https://unpkg.com/[email protected]"></script>
 </head>
 
 <body>
     <h1 id="hello" class="text-3xl font-bold text-blue-500 underline">
         Hello, {{ .Name }}!
     </h1>
+    <!-- have a button POST a click via AJAX -->
+    <button hx-get="/clicked" hx-swap="outerHTML" class="m-2 p-2 rounded-lg bg-slate-800 text-white">
+        Click Me
+    </button>
 </body>
 
 </html>