├── docs ├── resources └── public │ ├── css │ ├── style.css │ └── debug.css │ ├── test.html │ └── index.html ├── dev.cljs.edn ├── test └── juxt_edge │ ├── core_test.cljs │ └── test_runner.cljs ├── deploy.cljs.edn ├── .gitignore ├── test.cljs.edn ├── project.clj ├── figwheel-main.edn ├── README.md └── src └── juxt_edge └── core.cljs /docs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /resources/public/css/style.css: -------------------------------------------------------------------------------- 1 | /* some style */ 2 | 3 | -------------------------------------------------------------------------------- /dev.cljs.edn: -------------------------------------------------------------------------------- 1 | ^{:watch-dirs ["test" "src"] 2 | :css-dirs ["resources/public/css"] 3 | :auto-testing true} 4 | {:main juxt-edge.core} 5 | -------------------------------------------------------------------------------- /test/juxt_edge/core_test.cljs: -------------------------------------------------------------------------------- 1 | (ns juxt-edge.core-test 2 | (:require 3 | [cljs.test :refer-macros [deftest is testing]] 4 | [juxt-edge.core :refer [app-state]])) 5 | -------------------------------------------------------------------------------- /deploy.cljs.edn: -------------------------------------------------------------------------------- 1 | ^{:watch-dirs ["test" "src"] 2 | :css-dirs ["resources/public/css"] 3 | :auto-testing true} 4 | {:main juxt-edge.core 5 | :output-to "/docs/cljs-out/dev-main.js"} 6 | -------------------------------------------------------------------------------- /resources/public/test.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |

Test host page

5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | pom.xml 2 | *jar 3 | /lib/ 4 | /classes/ 5 | /out/ 6 | /target/ 7 | .lein-deps-sum 8 | .lein-repl-history 9 | .lein-plugins/ 10 | .repl 11 | .nrepl-port 12 | .cpcache/ 13 | .rebel_readline_history 14 | -------------------------------------------------------------------------------- /test/juxt_edge/test_runner.cljs: -------------------------------------------------------------------------------- 1 | ;; This test runner is intended to be run from the command line 2 | (ns juxt-edge.test-runner 3 | (:require 4 | ;; require all the namespaces that you want to test 5 | [juxt-edge.core-test] 6 | [figwheel.main.testing :refer [run-tests-async]])) 7 | 8 | (defn -main [& args] 9 | (run-tests-async 5000)) 10 | -------------------------------------------------------------------------------- /test.cljs.edn: -------------------------------------------------------------------------------- 1 | ^{ 2 | ;; use an alternative landing page for the tests so that we don't 3 | ;; launch the application 4 | :open-url "http://[[server-hostname]]:[[server-port]]/test.html" 5 | 6 | ;; uncomment to launch tests in a headless environment 7 | ;; you will have to figure out the path to chrome on your system 8 | ;; :launch-js ["/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" "--headless" "--disable-gpu" "--repl" :open-url] 9 | } 10 | {:main juxt-edge.test-runner} 11 | -------------------------------------------------------------------------------- /resources/public/css/debug.css: -------------------------------------------------------------------------------- 1 | /* Visually debugging CSS code */ 2 | 3 | /* Include this file when you only want to see the debug version of the CSS */ 4 | 5 | /* See article: https://medium.freecodecamp.org/heres-my-favorite-weird-trick-to-debug-css-88529aa5a6a3 */ 6 | 7 | /*! debug.css v0.0.1 | MIT License | zaydek.github.com/debug.css */ 8 | :not(g):not(path) { 9 | color: hsla(210, 100%, 100%, 0.9) !important; 10 | background: hsla(210, 100%, 50%, 0.5) !important; 11 | outline: solid 0.25rem hsla(210, 100%, 100%, 0.5) !important; 12 | 13 | box-shadow: none !important; 14 | filter: none !important; 15 | } 16 | -------------------------------------------------------------------------------- /resources/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 |
21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /project.clj: -------------------------------------------------------------------------------- 1 | (defproject juxt-edge "0.1.0-SNAPSHOT" 2 | :description "A landing page for the Edge project by JUXT" 3 | :url "https://github.com/juxt/edge" 4 | :license {:name "Creative Commons Attribution Share-Alike 4.0 International" 5 | :url "https://creativecommons.org"} 6 | 7 | :min-lein-version "2.7.1" 8 | 9 | :dependencies [[org.clojure/clojure "1.10.0"] 10 | [org.clojure/clojurescript "1.10.339"] 11 | [reagent "0.8.1"]] 12 | 13 | :source-paths ["src"] 14 | 15 | :aliases {"fig" ["trampoline" "run" "-m" "figwheel.main"] 16 | "fig:build" ["trampoline" "run" "-m" "figwheel.main" "-b" "dev" "-r"] 17 | "fig:min" ["run" "-m" "figwheel.main" "-O" "advanced" "-bo" "dev"] 18 | "fig:deploy" ["run" "-m" "figwheel.main" "-O" "advanced" "-bo" "deploy"] 19 | "fig:test" ["run" "-m" "figwheel.main" "-co" "test.cljs.edn" "-m" juxt-edge.test-runner]} 20 | 21 | :profiles {:dev {:dependencies [[com.bhauman/figwheel-main "0.1.9"] 22 | [com.bhauman/rebel-readline-cljs "0.1.4"]] 23 | }}) 24 | 25 | -------------------------------------------------------------------------------- /figwheel-main.edn: -------------------------------------------------------------------------------- 1 | ;; Figwheel-main configuration options see: https://figwheel.org/config-options 2 | ;; these will be overriden by the metadata config options in dev.cljs.edn build file 3 | { 4 | ;; Set the server port https://figwheel.org/config-options#ring-server-options 5 | ;; :ring-server-options {:port 9500} 6 | 7 | ;; Change the target directory from the "target" to "resources" 8 | ;; https://figwheel.org/config-options#target-dir 9 | :target-dir "resources" 10 | 11 | ;; Server Ring Handler (optional) https://figwheel.org/docs/ring-handler.html 12 | ;; If you want to embed a ring handler into the figwheel server, this 13 | ;; is for simple ring servers 14 | ;; :ring-handler hello_world.server/handler 15 | 16 | ;; To be able to open files in your editor from the heads up display 17 | ;; you will need to put a script on your path. This script will have 18 | ;; to take a file path and a line number ie. 19 | ;; in ~/bin/myfile-opener: 20 | ;; 21 | ;; #! /bin/sh 22 | ;; emacsclient -n +$2:$3 $1 23 | ;; 24 | ;; :open-file-command "myfile-opener" 25 | 26 | ;; if you are using emacsclient you can just use 27 | ;; :open-file-command "emacsclient" 28 | 29 | ;; Logging output gets printed to the REPL, if you want to redirect it to a file: 30 | ;; :log-file "figwheel-main.log" 31 | } 32 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # juxt-edge 2 | 3 | A draft landing page for the JUXT edge project 4 | 5 | ## Overview 6 | 7 | A single page application written in ClojureScript (with figwheel-main, reagent and Bulma.io) as a starting point for the project. 8 | 9 | The [bulma launch page video](https://scrimba.com/p/pV5eHk/cvrwyfR) was used as inspiration for this design. 10 | 11 | ## Development 12 | 13 | ### Spacemacs 14 | 15 | Open the file `src/juxt_edge/core.cljs` 16 | 17 | `, "` or `M-RET "` to start the REPL using `cider-jack-in-clojurescript` 18 | 19 | Select `figwheel-main` when prompted for the build tool (in a helm menu popup) 20 | 21 | Enter `dev` when prompted for the build name (in the mini-buffer) 22 | 23 | 24 | ### Run in a terminal window 25 | 26 | To get an interactive development environment run: 27 | 28 | lein fig:build 29 | 30 | This will auto compile and send all changes to the browser without the 31 | need to reload. After the compilation process is complete, you will 32 | get a Browser Connected REPL. An easy way to try it is: 33 | 34 | (js/alert "Am I connected?") 35 | 36 | and you should see an alert in the browser window. 37 | 38 | To clean all compiled files: 39 | 40 | lein clean 41 | 42 | To create a production build run: 43 | 44 | lein clean 45 | lein fig:min 46 | 47 | 48 | ## License 49 | 50 | Copyright © 2019 jr0cket 51 | 52 | Distributed under the Creative Commons Attribution Share-Alike 4.0 International 53 | -------------------------------------------------------------------------------- /src/juxt_edge/core.cljs: -------------------------------------------------------------------------------- 1 | (ns ^:figwheel-hooks juxt-edge.core 2 | (:require 3 | [goog.dom :as gdom] 4 | [reagent.core :as reagent :refer [atom]])) 5 | 6 | ;; Basic application reloading logging 7 | ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; 8 | 9 | ;; Use Google clojure data function to date-time stamp on each application reload 10 | 11 | (println (js/Date.) "JUXT Edge application updated") 12 | 13 | 14 | ;; Application state 15 | ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; 16 | 17 | ;; define your app data so that it doesn't get over-written on reload 18 | (defonce app-state (atom {:text "Hello world!"})) 19 | 20 | ;; Components 21 | ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; 22 | 23 | (defn hello-world [] 24 | [:div 25 | [:h1 (:text @app-state)] 26 | [:h3 "Edit this in src/juxt_edge/core.cljs and watch it change!"]]) 27 | 28 | 29 | ;; System 30 | ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; 31 | 32 | (defn get-app-element [] 33 | (gdom/getElement "app")) 34 | 35 | (defn mount [el] 36 | (reagent/render-component [hello-world] el)) 37 | 38 | (defn mount-app-element [] 39 | (when-let [el (get-app-element)] 40 | (mount el))) 41 | 42 | ;; conditionally start your application based on the presence of an "app" element 43 | ;; this is particularly helpful for testing this ns without launching the app 44 | (mount-app-element) 45 | 46 | ;; specify reload hook with ^;after-load metadata 47 | (defn ^:after-load on-reload [] 48 | (mount-app-element) 49 | ;; optionally touch your app-state to force rerendering depending on 50 | ;; your application 51 | ;; (swap! app-state update-in [:__figwheel_counter] inc) 52 | ) 53 | --------------------------------------------------------------------------------