core.cljs

(ns reacao.cola)

;; primeiro examplo
(defn e
  [el props & children]
  (apply js/React.createElement el (clj->js props) children))

(defn mount
  []
  (js/ReactDOM.render
   (e "div" nil "Hello, world")
   (js/document.getElementById "app")))

;; segundo examplo
(defn Example
  []
  (let [[count setCount] (js/React.useState 0)]
    (e "div" nil
       (e "p" nil "You clicked " count " times")
       (e "button"
          {:onClick
           (fn [e]
             (setCount (inc count)))}
          "Click Me"))))

(defn mount
  []
  (js/ReactDOM.render
   (e Example nil)
   (js/document.getElementById "app")))

;;a hicada

;; compiler.cljs
(ns reacao.compiler
  (:require
   [goog.object :as obj]
   ["react" :as react])
  (:require-macros [reacao.compiler]))

(obj/set js/window "React" react)

;; compiler.clj
(ns reacao.compiler
  (:require
   [hicada.compiler :as compiler]))

(defmacro html
  [body]
  (compiler/compile body {:array-children? false}
                    {} &env))

;;
(ns reacao.core
  (:require
   [reacao.compiler :refer [html] :include-macros true]
   [goog.object :as obj]
   ["react" :as react]
   ["react-dom" :as rdom]))

(defn my-component
  []
  (let [[count setCount] (.useState react 0)]
    (.useEffect react (fn []
                        (obj/set js/document "title" count)))
    (html
     [:div
      [:button {:onClick #(setCount (dec count))}
       "-"]
      (str count)
      [:button {:onClick #(setCount (inc count))}
       "+"]])))

(defn main!
  []
  (rdom/render (.createElement react my-component)
               (.querySelector js/document "#app")))