Juno Stakedrop frontend

This is a shadow-cljs and reframe Javascript application. It is intended to be a simple frontend to display queried balances.

Balances will be put into LocalStorage to avoid multiple lookups.

Development

Getting started

Run the shadow-cljs watcher for the first time. Shadow is a build tool that bridges CLJ and Node, allowing for more seamless interop between the two platforms.

npm install
npx shadow-cljs watch app

The first time, it will take a while to run.

When the build has finished, it will log the ports it is running on, and then something like:

[:app] Build completed. (512 files, 0 compiled, 0 warnings, 25.08s)

When that happens, you can navigate to port 8080 in your browser and open the app.

There's also a shorthand in the NPM runner:

npm run dev:watch

Connecting to the browser REPL from your editor

See Shadow CLJS User's Guide: Editor Integration. Note that lein dev runs shadow-cljs watch for you, and that this project's running build id is app, or the keyword :app in a Clojure context.

Alternatively, search the web for info on connecting to a shadow-cljs ClojureScript browser REPL from your editor and configuration.

For example, in Vim / Neovim with fireplace.vim

1. Open a .cljs file in the project to activate fireplace.vim
2. In normal mode, execute the Piggieback command with this project's running build id, :app:

   :Piggieback :app

Connecting to the browser REPL from a terminal

1. Connect to the shadow-cljs nREPL:

   lein repl :connect localhost:8777

   The REPL prompt, shadow.user=>, indicates that is a Clojure REPL, not ClojureScript.

2. In the REPL, switch the session to this project's running build id, :app:

   (shadow.cljs.devtools.api/nrepl-select :app)

   The REPL prompt changes to cljs.user=>, indicating that this is now a ClojureScript REPL.

3. See user.cljs for symbols that are immediately accessible in the REPL without needing to require.

Running Tests

Build the app with the prod profile, start a temporary local web server, launch headless Chrome/Chromium, run tests, and stop the web server:

lein karma

Please be patient; it may take over 15 seconds to see any output, and over 25 seconds to complete.

Running shadow-cljs Actions

See a list of shadow-cljs CLI actions:

lein run -m shadow.cljs.devtools.cli --help

Please be patient; it may take over 10 seconds to see any output. Also note that some actions shown may not actually be supported, outputting "Unknown action." when run.

Run a shadow-cljs action on this project's build id (without the colon, just app):

lein run -m shadow.cljs.devtools.cli <action> app

Debug Logging

The debug? variable in config.cljs defaults to true in dev builds, and false in prod builds.

Use debug? for logging or other tasks that should run only on dev builds:

(ns juno.example
  (:require [juno.config :as config])

(when config/debug?
  (println "This message will appear in the browser console only on dev builds."))

Production

Make sure you have set the prod host in events.cljs - at some point this will be configured by env vars.

Build the app with the prod profile:

lein prod

Please be patient; it may take over 15 seconds to see any output, and over 30 seconds to complete.

The resources/public/js/compiled directory is created, containing the compiled app.js and manifest.edn files.

The resources/public directory contains the complete, production web front end of your app.

Always inspect the resources/public/js/compiled directory prior to deploying the app. Running any lein alias in this project after lein dev will, at the very least, run lein clean, which deletes this generated directory. Further, running lein dev will generate many, much larger development versions of the files in this directory.

Then, minify the css:

npm run minify-css