Reagent
This commit is contained in:
Michiel Borkent
parent
b10fa0e9ca
commit
347903bd29
5 changed files with 18 additions and 137 deletions
14
README.md
14
README.md
|
|
@ -13,12 +13,11 @@ for a minimal full stack web application.
|
|||
See [releases](https://github.com/babashka/scittle/releases) for links to
|
||||
[JSDelivr](https://www.jsdelivr.com) to get versioned artifacts.
|
||||
|
||||
## Developing with scittle
|
||||
|
||||
### Serving assets
|
||||
## Serving assets
|
||||
|
||||
To serve assets you can use the
|
||||
[babashka.http-server](https://github.com/babashka/http-server) dependency:
|
||||
[babashka.http-server](https://github.com/babashka/http-server) dependency (with
|
||||
babashka or Clojure JVM):
|
||||
|
||||
``` clojure
|
||||
(require '[babashka.http-server :as http])
|
||||
|
|
@ -41,7 +40,8 @@ In babashka or Clojure JVM, use the
|
|||
|
||||
This will run an nREPL server on port 1339 and a websocket server on port 1340.
|
||||
Your editor's nREPL client will connect to port 1339 and your browser, running
|
||||
scittle, will connect to port 1340.
|
||||
scittle, will connect to port 1340. The nREPL server forwards messages to the
|
||||
browser via the websocket connection.
|
||||
|
||||
In your scittle website, you will need to include the following, in addition to
|
||||
the normal routine:
|
||||
|
|
@ -60,6 +60,10 @@ Also include the CLJS file that you want to evaluate with nREPL:
|
|||
Then visit `cljs/script.cljs` in your editor and connect to the nREPL server,
|
||||
and start evaluating!
|
||||
|
||||
See the `resources/public/nrepl.html` file for an example. When you run `bb dev`
|
||||
in this repository, and then open `http://localhost:1341/nrepl.html` you should
|
||||
be able evaluate expressions in `resources/public/cljs/nrepl_playground.cljs`.
|
||||
|
||||
## Tasks
|
||||
|
||||
Run `bb tasks` to see all available tasks:
|
||||
|
|
|
|||
4
deps.edn
4
deps.edn
|
|
@ -11,7 +11,9 @@
|
|||
|
||||
io.github.babashka/sci.nrepl
|
||||
#_{:local/root "../sci.nrepl"}
|
||||
{:git/sha "e83421ce9349c36df56a2eb936196dbb65b0de63"}}
|
||||
{:git/sha "e83421ce9349c36df56a2eb936196dbb65b0de63"}
|
||||
io.github.babashka/sci.configs
|
||||
{:git/sha "fcd367c6a6115c5c4e41f3a08ee5a8d5b3387a18"}}
|
||||
|
||||
:aliases
|
||||
{:dev
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
(ns nrepl)
|
||||
|
||||
(+ 1 2 3)
|
||||
|
||||
(->
|
||||
(js/document.getElementsByTagName "body")
|
||||
first
|
||||
(.append
|
||||
(doto (js/document.createElement "p")
|
||||
(.append
|
||||
(js/document.createTextNode "there")))))
|
||||
|
||||
(defn foo [])
|
||||
|
||||
(js/alert "Isn't this cool? :)")
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
<script src="js/scittle.js" type="application/javascript"></script>
|
||||
<script>var SCITTLE_BROWSER_REPL_PROXY_PORT = 1340;</script>
|
||||
<script src="js/scittle.nrepl.js" type="application/javascript"></script>
|
||||
<script type="application/x-scittle" src="cljs/nrepl.cljs"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Scittle</h1>
|
||||
<h2>What is this?</h2>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,106 +1,10 @@
|
|||
(ns scittle.reagent
|
||||
(:require [reagent.core :as r]
|
||||
[reagent.debug :as d :refer-macros [dev?]]
|
||||
[reagent.dom :as rdom]
|
||||
[reagent.ratom :as ratom]
|
||||
[sci.core :as sci]
|
||||
[scittle.core :as scittle]))
|
||||
|
||||
;; The with-let macro from reagent.core. The only change is that the
|
||||
;; interop/unchecked-aget+set were replaced by aget and aset.
|
||||
(defn ^:macro with-let [_ _ bindings & body]
|
||||
(assert (vector? bindings)
|
||||
(str "with-let bindings must be a vector, not "
|
||||
(pr-str bindings)))
|
||||
(let [v (gensym "with-let")
|
||||
k (keyword v)
|
||||
init (gensym "init")
|
||||
;; V is a reaction, which holds a JS array.
|
||||
;; If the array is empty, initialize values and store to the
|
||||
;; array, using binding index % 2 to access the array.
|
||||
;; After init, the bindings are just bound to the values in the array.
|
||||
bs (into [init `(zero? (alength ~v))]
|
||||
(map-indexed (fn [i x]
|
||||
(if (even? i)
|
||||
x
|
||||
(let [j (quot i 2)]
|
||||
;; Issue 525
|
||||
;; If binding value is not yet set,
|
||||
;; try setting it again. This should
|
||||
;; also throw errors for each render
|
||||
;; and prevent the body being called
|
||||
;; if bindings throw errors.
|
||||
`(if (or ~init
|
||||
(not (.hasOwnProperty ~v ~j)))
|
||||
(aset ~v ~j ~x)
|
||||
(aget ~v ~j)))))
|
||||
bindings))
|
||||
[forms destroy] (let [fin (last body)]
|
||||
(if (and (list? fin)
|
||||
(= 'finally (first fin)))
|
||||
[(butlast body) `(fn [] ~@(rest fin))]
|
||||
[body nil]))
|
||||
add-destroy (when destroy
|
||||
(list
|
||||
`(let [destroy# ~destroy]
|
||||
(if (reagent.ratom/reactive?)
|
||||
(when (nil? (.-destroy ~v))
|
||||
(set! (.-destroy ~v) destroy#))
|
||||
(destroy#)))))
|
||||
asserting (dev?) #_(if *assert* true false)
|
||||
res (gensym "res")]
|
||||
`(let [~v (reagent.ratom/with-let-values ~k)]
|
||||
~(when asserting
|
||||
`(when-some [c# (reagent.ratom/-ratom-context)]
|
||||
(when (== (.-generation ~v) (.-ratomGeneration c#))
|
||||
(d/error "Warning: The same with-let is being used more "
|
||||
"than once in the same reactive context."))
|
||||
(set! (.-generation ~v) (.-ratomGeneration c#))))
|
||||
(let ~(into bs [res `(do ~@forms)])
|
||||
~@add-destroy
|
||||
~res))))
|
||||
|
||||
(def rns (sci/create-ns 'reagent.core nil))
|
||||
|
||||
(def reagent-namespace
|
||||
{'atom (sci/copy-var r/atom rns)
|
||||
'as-element (sci/copy-var r/as-element rns)
|
||||
'with-let (sci/copy-var with-let rns)
|
||||
'cursor (sci/copy-var r/cursor rns)
|
||||
'create-class (sci/copy-var r/create-class rns)
|
||||
'create-compiler (sci/copy-var r/create-compiler rns)})
|
||||
|
||||
(def rtmns (sci/create-ns 'reagent.ratom nil))
|
||||
|
||||
(defn -ratom-context
|
||||
"Read-only access to the ratom context."
|
||||
[]
|
||||
ratom/*ratom-context*)
|
||||
|
||||
(def reagent-ratom-namespace
|
||||
{'with-let-values (sci/copy-var ratom/with-let-values rtmns)
|
||||
'reactive? (sci/copy-var ratom/reactive? rtmns)
|
||||
'-ratom-context (sci/copy-var -ratom-context rtmns)})
|
||||
|
||||
(def rdbgns (sci/create-ns 'reagent.debug nil))
|
||||
|
||||
(defn -tracking? []
|
||||
reagent.debug/tracking)
|
||||
|
||||
(defn ^:macro error
|
||||
"Print with console.error."
|
||||
[_ _ & forms]
|
||||
(when *assert*
|
||||
`(when (some? js/console)
|
||||
(.error (if (reagent.debug/-tracking?)
|
||||
reagent.debug/track-console
|
||||
js/console)
|
||||
(str ~@forms)))))
|
||||
|
||||
(def reagent-debug-namespace
|
||||
{'error (sci/copy-var error rdbgns)
|
||||
'-tracking? (sci/copy-var -tracking? rdbgns)
|
||||
'track-console (sci/copy-var d/track-console rdbgns)})
|
||||
(:require
|
||||
[reagent.dom :as rdom]
|
||||
[sci.configs.reagent.reagent :refer [reagent-debug-namespace
|
||||
reagent-namespace reagent-ratom-namespace]]
|
||||
[sci.core :as sci]
|
||||
[scittle.core :as scittle]))
|
||||
|
||||
(def rdns (sci/create-ns 'reagent.dom nil))
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue