├── resources └── public │ ├── css │ └── style.css │ ├── test.html │ └── index.html ├── dev.cljs.edn ├── .gitignore ├── test └── practicalli │ ├── simple_demo_test.cljs │ └── test_runner.cljs ├── test.cljs.edn ├── deps.edn ├── src └── practicalli │ └── simple_demo.cljs ├── figwheel-main.edn └── README.md /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 | } 5 | {:main practicalli.simple-demo} 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/practicalli/simple_demo_test.cljs: -------------------------------------------------------------------------------- 1 | (ns practicalli.simple-demo-test 2 | (:require 3 | [cljs.test :refer-macros [deftest is testing]] 4 | [practicalli.simple-demo :refer [multiply]])) 5 | 6 | (deftest multiply-test 7 | (is (= (* 1 2) (multiply 1 2)))) 8 | 9 | (deftest multiply-test-2 10 | (is (= (* 75 10) (multiply 10 75)))) 11 | -------------------------------------------------------------------------------- /test/practicalli/test_runner.cljs: -------------------------------------------------------------------------------- 1 | ;; This test runner is intended to be run from the command line 2 | (ns practicalli.test-runner 3 | (:require 4 | ;; require all the namespaces that you want to test 5 | [practicalli.simple-demo-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 practicalli.test-runner} 11 | -------------------------------------------------------------------------------- /deps.edn: -------------------------------------------------------------------------------- 1 | {:deps {org.clojure/clojure {:mvn/version "1.10.0"} 2 | org.clojure/clojurescript {:mvn/version "1.10.773"}} 3 | :paths ["src" "resources"] 4 | :aliases {:fig {:extra-deps 5 | {com.bhauman/rebel-readline-cljs {:mvn/version "0.1.4"} 6 | com.bhauman/figwheel-main {:mvn/version "0.2.11"}} 7 | :extra-paths ["target" "test"]} 8 | :build {:main-opts ["-m" "figwheel.main" "-b" "dev" "-r"]} 9 | :min {:main-opts ["-m" "figwheel.main" "-O" "advanced" "-bo" "dev"]} 10 | :test {:main-opts ["-m" "figwheel.main" "-co" "test.cljs.edn" "-m" "practicalli.test-runner"]}}} 11 | -------------------------------------------------------------------------------- /src/practicalli/simple_demo.cljs: -------------------------------------------------------------------------------- 1 | (ns ^:figwheel-hooks practicalli.simple-demo 2 | (:require 3 | [goog.dom :as gdom])) 4 | 5 | (println "This text is printed from src/practicalli/simple_demo.cljs. Go ahead and edit it and see reloading in action.") 6 | 7 | (defn multiply [a b] (* a b)) 8 | 9 | ;; define your app data so that it doesn't get over-written on reload 10 | (defonce app-state (atom {:text "Hello world!"})) 11 | 12 | (defn get-app-element [] 13 | (gdom/getElement "app")) 14 | 15 | 16 | 17 | ;; specify reload hook with ^;after-load metadata 18 | (defn ^:after-load on-reload [] 19 | ;; optionally touch your app-state to force rerendering depending on 20 | ;; your application 21 | ;; (swap! app-state update-in [:__figwheel_counter] inc) 22 | ) 23 | -------------------------------------------------------------------------------- /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 | ;; Target directory https://figwheel.org/config-options#target-dir 8 | ;; you may want to set this to resources if you are using Leiningen 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 | # ClojureScript, figwheel-main and reagent simple demo 2 | 3 | Project created with the [figwheel-main](https://github.com/bhauman/figwheel-main-template) template using Clojure CLI tools 4 | 5 | ``` 6 | clojure -X:project/new :template figwheel-main :name practicalli/simple-demo -- -reagent 7 | ``` 8 | 9 | 10 | ## Development 11 | Run an interactive development environment: 12 | 13 | clojure -M:fig:build 14 | 15 | The command compiles the ClojureScript code into JavaScript and send that code to the JavaScript engine in the default browser, providing a Browser connected REPL for the ClojureScript project. 16 | 17 | Changes to the ClojureScript source code are automatically compiled and sent to browser REPL without the need to reload. 18 | 19 | Evaluate a call to `js/alert` as simple check that the browser repl is responding to changes 20 | 21 | (js/alert "Am I connected?") 22 | 23 | An alert box should popup in the browser window. 24 | 25 | 26 | Clean the project by removing all the compiled files: 27 | 28 | rm -rf target/public 29 | 30 | Create a production build run: 31 | 32 | rm -rf target/public 33 | clojure -M:fig:min 34 | 35 | 36 | The `figwheel-main.edn` file can contain different build configurations, defined in their own build configurations, e.g. `dev.cljs.edn`, `test.cljs.edn`. 37 | 38 | ## License 39 | Copyright © 2018 Practicalli 40 | 41 | Distributed under the Creative Commons Attribution Share-Alike 4.0 International 42 | -------------------------------------------------------------------------------- /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 |
25 |
26 |
Template Generated Index.html
27 |
28 |
29 | Figwheel Main 30 | CLJS 31 | Cheatsheet 32 | Synonyms 33 |
34 |
35 | 36 |
37 | 43 |
44 |

Welcome to the template generated index.html

45 | 46 |
47 |

TLDR: you can find and edit this file at resources/public/index.html

48 |
49 | 50 |

This page is currently hosting your application code and REPL (Read 51 | Eval Print Loop). As you change your code and save it, the 52 | changed code will be hot loaded into this browser page.

53 | 54 |

If you return to the terminal where you launched figwheel and enter 55 | valid ClojureScript code at the cljs.user=> prompt, the code will be 56 | compiled to Javascript and evaluated in the JavaScript environment on 57 | this page.

58 | 59 |

If you close this page the REPL will cease to function.

60 | 61 |

Editing this index.html

62 | 63 |

When you view the content of resources/public/index.html there will 64 | be comments that show you how to remove this initial content. It is 65 | important that you keep the final <script> tag that requires your compiled 66 | ClojureScript code.

67 |
68 |
69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 |
78 | 79 | 80 | 81 | 82 | 83 | --------------------------------------------------------------------------------