ClojureScript

Minimal React wrapper with Hiccup syntax Event/subscription architecture on Reagent (like Redux) UIx, Helix Modern React hooks wrappers Data-driven rendering without React Build tool with npm integration Squint, Cherry

Lightweight ClojureScript-like compilers to JS Electric Clojure

Full-stack reactive programming spanning client and server .cljc files share code between Clojure and ClojureScript using reader conditionals: #?(:clj (java.util.UUID/randomUUID):cljs (random-uuid)).

;; shadow-cljs.edn
{:source-paths ["src"]
 :dependencies [[reagent "1.2.0"]]
 :builds {:app {:target :browser
                :output-dir "public/js"
                :modules {:main {:init-fn app.core/init}}}}}

;; src/app/core.cljs
(ns app.core
  (:require [reagent.core :as r]
            [reagent.dom.client :as rdc]))

(defonce counter (r/atom 0))               ; reactive atom

(defn counter-view []
  [:div
   [:h1 "Count: " @counter]
   [:button {:on-click #(swap! counter inc)} "+"]
   [:button {:on-click #(swap! counter dec)} "-"]])

(defonce root (rdc/create-root (js/document.getElementById "app")))
(defn init [] (rdc/render root [counter-view]))

;; JavaScript interop
(js/console.log "hello")
(.getElementById js/document "app")
(.-length "abc")                           ; property access
(clj->js {:a 1}) (js->clj #js {:a 1} :keywordize-keys true)

npx shadow-cljs watch app                  # hot-reloading dev build
npx shadow-cljs release app                # optimized build (Google Closure Compiler)