Stimulus ❤️ Clojure

Stimulus is “a modest JavaScript framework for the HTML you already have.” It was created by 37signals as an alternative to heavier approaches to client-side interactions.

This is an experimental library that lets you write Stimulus controllers using Clojure.

Usage

Server-side

(ns my.example
  (:require [hiccup.page :as page]
            [io.pedestal.http :as http]
            [io.pedestal.http.route :as route])
  (:gen-class))

(defn home [req]
  {:status  200
   :headers {"Content-Type" "text/html; charset=utf-8"}
   :body    (page/html5 [:head
                         [:title "Stimulus Examples"]
                         (page/include-js "/js/main.js")]
                        [:div {:data-controller "hello"}
                         [:input {:data-hello-target "name", :type "text"}]
                         [:button {:data-action "click->hello#greet"} "Greet"]
                         [:span {:data-hello-target "output"}]])})

(def routes
  (route/expand-routes
    #{["/" :get home :route-name :home]}))

(defn -main
  [& args]
  (-> {::http/routes         routes
       ::http/port           3000
       ::http/resource-path  "/public"
       ::http/secure-headers {:content-security-policy-settings {:object-src "none"}}
       ::http/type           :jetty}
      http/create-server
      http/start))

Client-side

(ns stimulus.example.example
  (:require [stimulus.controller :refer [->controller]]
            ["@hotwired/stimulus" :refer [Controller Application]]
            [goog.dom :as gdom]))

(defn greet [controller event]
  (let [name-target (get-name-target controller)
        output-target (get-output-target controller)]
    (gdom/setTextContent output-target (str "Hello, " (.-value name-target)))))
  
(def greet-controller (-> {:extends Controller
                           :targets ["output" "name"]
                           :actions {:greet greet}}
                          ->controller))

(let [application (.start Application)]
  (.register application "hello" greet-controller))