Simple project
This is a simple ClojureScript project with no additional application dependencies. The project uses figwheel-main as a ClojureScript development tool, for live loading of changes into the browser and also for building the projects with different configurations.
{% tabs deps="Clojure CLI project", lein="Leiningen project" %}
{% content "deps" %}
Create a Clojure CLI tools deps.edn project using the :project/new alias from practicalli/clojure-deps-edn configuration.
Run this command in a terminal window
The command will create a new directory with the project name
{% content "lein" %}
Create a Leiningen project.clj project using the following command, including --reagent which is a common library for reactive web page development
{% endtabs %}
Run a ClojureScript projectλ︎
Run the ClojureScript project from the command line initially to ensure that everything is working.
The project will start a REPL and figwheel-main will launch a connected browser REPL in the default web browser.
In the terminal window used to create the project, change into the project directory
{% tabs depsrepl="Clojure CLI project", leinrepl="Leiningen project" %}
{% content "depsrepl" %}
Use the Clojure CLI tools to run the project using the :fig alias and the :build build task.
Also use :repl/rebel alias from practicalli/clojure-deps-edn to run the REPL with rebel readline for a richer REPL experience.
{% content "leinrepl" %}
Use Leiningen to run the ClojureScript project using the :fig alias and the :build build task.
{% endtabs %}
A window or tab should automatically open once the project starts. This takes a few moments, so take a few deep breaths.
Check the browser connectionλ︎
Check the browser REPL is connected by evaluating a ClojureScript expression in the ClojureScript REPL.
In the terminal at the ClojureScript REPL prompt, show an alert box in the browser.
The web page updates and shows a dialog box with the message.
Add the js/alert expression as a rich comment block to the src/practicalli/landing_page.cljs source code file. This provides a convenient way to test the figwheel-main connection to the browser without being part of the main code.