nREPL docs

README.md

@@ -27,61 +27,7 @@ babashka or Clojure JVM):
 
 ### nREPL
 
-To connect to a Scittle nREPL server from your editor, follow these steps:
+See [doc/nrepl](doc/nrepl).
-
-In babashka or Clojure JVM, use the
-[sci.nrepl](https://github.com/babashka/sci.nrepl) dependency and run:
-
-```
-(require 'sci.nrepl.browser-server :as nrepl)
-(nrepl/start! {:nrepl-port 1339 :websocket-port 1340})
-```
-
-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. 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:
-
-```
-<script>var SCITTLE_NREPL_WEBSOCKET_PORT = 1340;</script>
-<script src="https://cdn.jsdelivr.net/npm/scittle@0.2.8/dist/scittle.nrepl.js" type="application/javascript"></script>
-```
-
-Also include the CLJS file that you want to evaluate with nREPL:
-
-```
-<script src="cljs/script.cljs" type="application/x-scittle"></script>
-```
-
-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`. See a demo
-[here](https://twitter.com/borkdude/status/1526285565343281159).
-
-### CIDER
-
-Currently when connecting from CIDER, you need to use this snippet:
-
-```
-(cider-register-cljs-repl-type 'sci-js "(+ 1 2 3)")
-
-(defun mm/cider-connected-hook ()
-  (when (eq 'sci-js cider-cljs-repl-type)
-    (setq-local cider-show-error-buffer nil)
-    (cider-set-repl-type 'cljs)))
-
-(add-hook 'cider-connected-hook #'mm/cider-connected-hook)
-```
-
-Then choose `cider-connect-cljs`, select port `1339`, followed by the `sci-js`
-REPL type.
 
 ## Tasks
 

doc/nrepl/README.md

@@ -0,0 +1,61 @@
+# nREPL
+
+To connect to a Scittle nREPL server from your editor, follow these steps. The
+setup described here, can be found in this directory.
+
+In babashka or Clojure JVM, use the
+[sci.nrepl](https://github.com/babashka/sci.nrepl) dependency and run:
+
+```
+(require 'sci.nrepl.browser-server :as nrepl)
+(nrepl/start! {:nrepl-port 1339 :websocket-port 1340})
+```
+
+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. 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:
+
+```
+<script>var SCITTLE_NREPL_WEBSOCKET_PORT = 1340;</script>
+<script src="https://cdn.jsdelivr.net/npm/scittle@0.2.8/dist/scittle.nrepl.js" type="application/javascript"></script>
+```
+
+Also include the CLJS file that you want to evaluate with nREPL:
+
+```
+<script src="playground.cljs" type="application/x-scittle"></script>
+```
+
+Then visit `playground.cljs` in your editor and connect to the nREPL server,
+and start evaluating!
+
+See the `index.html` file for an example.
+
+When you run `bb dev` in this directory, and then open `http://localhost:1341`
+you should be able evaluate expressions in `playground.cljs`. See a demo
+[here](https://twitter.com/borkdude/status/1526285565343281159).
+
+Note that the nREPL server connection stays alive even after the browser window
+refreshes.
+
+### CIDER
+
+Currently when connecting from CIDER, you need to use this snippet:
+
+```
+(cider-register-cljs-repl-type 'sci-js "(+ 1 2 3)")
+
+(defun mm/cider-connected-hook ()
+  (when (eq 'sci-js cider-cljs-repl-type)
+    (setq-local cider-show-error-buffer nil)
+    (cider-set-repl-type 'cljs)))
+
+(add-hook 'cider-connected-hook #'mm/cider-connected-hook)
+```
+
+Then choose `cider-connect-cljs`, select port `1339`, followed by the `sci-js`
+REPL type.

doc/nrepl/bb.edn

@@ -0,0 +1,17 @@
+{:deps {io.github.babashka/sci.nrepl
+        {:git/sha "c14b5b4ef4390ff206cdb71f763f327799f5e853"}
+        io.github.babashka/http-server
+        {:git/sha "b38c1f16ad2c618adae2c3b102a5520c261a7dd3"}}
+ :tasks {http-server {:doc "Starts http server for serving static files"
+                      :requires ([babashka.http-server :as http])
+                      :task (do (http/serve {:port 1341 :dir "."})
+                                (println "Serving static assets at http://localhost:1341"))}
+
+         browser-nrepl {:doc "Start browser nREPL"
+                        :requires ([sci.nrepl.browser-server :as bp])
+                        :task (bp/start! {})}
+
+         -dev {:depends [http-server browser-nrepl]}
+
+         dev {:task (do (run '-dev {:parallel true})
+                        (deref (promise)))}}}

doc/nrepl/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script src="https://cdn.jsdelivr.net/npm/scittle@0.2.8/dist/scittle.js" type="application/javascript"></script>
+    <script>var SCITTLE_NREPL_WEBSOCKET_PORT = 1340;</script>
+    <script src="https://cdn.jsdelivr.net/npm/scittle@0.2.8/dist/scittle.nrepl.js" type="application/javascript"></script>
+    <script type="application/x-scittle" src="playground.cljs"></script>
+  </head>
+  <body>
+    <h1>Scittle</h1>
+    <h2>What is this?</h2>
+  </body>
+</html>

doc/nrepl/playground.cljs

@@ -0,0 +1,15 @@
+(ns playground)
+
+(+ 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? :)")