A template for starting a new, frontend-only Fulcro application with in-browser Pathom. Intended for playing with and learning Fulcro, not for production apps, and therefore simpler than the official fulcro-template. It is a good starting point for your learning projects that is hopefully simple enough for you to understand.
For a template that has an actual backend, see minimalist-fulcro-template.
Until 2023-09 (last sha 624d546e7), we used Pathom 2.
Fulcro Inspect's Index Explorer is not compatible with Pathom 3. You need to use a standalone Pathom Viz (see my article for details.). What you need to do then is to
- download Pathom Viz app
- Make
com.example.pathom/enable-pathom-viz
true - Reload your app and connect P. Viz to it
P. Viz support is off by default because otherwise it logs tons of errors and warnings, until you connect it.
Download or clone this repository to your computer and start hacking away.
You will run shadow-cljs, which will watch, compile, and update the sources and also run a HTTP server to serve the application.
Prerequisites: same as shadow-cljs'.
First, install frontend dependencies via npm, yarn, or similar:
npm install # or yarn install # reportedly yarn < v3
then start the application either via
npx shadow-cljs watch main
or, if you have Babashka installed, via
bb run
NOTE: For Calva, do instead start the REPL from the editor - run Jack-in, selecting shadow-cljs then the :main
build. Remember to load the page in the browser, see below.
Finally, navigate to http://localhost:8000 and, after that, connect to the shadow-cljs nREPL at port 9001* and switch to the browser REPL by evaluating (shadow/repl :main)
(Calva does the latter for you).
If you opened the cloned repo in VS Code, it will offer you to open it using Dev Containers, i.e. inside a pre-configured Docker instance (provided that you have Docker installed). This may be a great option if you run into problems that could be caused by the environment.
It will take a while (to build the container for the first time). Eventially, a Terminal should open, telling you that everything is fine and to press any key. After you do that, a normal terminal will open, where you should execute shadow-cljs:
vscode ➜ /workspaces/minimalist-fulcro-template-backendless (main) $ npx shadow-cljs watch main
Eventually, Code will inform you that "Your application running on port 8000 is available.", which you can agree to. (Ignore the previous message about 9001, that is nrepl). Then wait for the terminal to show [:main] Build completed.
and reload the web page. You should be now able to Calva: Connect to a Running REPL Server in the Project. When asked, select shadow-cljs
as the kind of the repl and then the :main
build.
You can also compile the sources into a directory via
npx shadow-cljs release main
# or: bb build
and then serve the whole website using a HTTP server, e.g.:
cd resources/public/
python3 -m http.server 8000
No thought was given to security, performance, monitoring, error tracking and other important production concerns. It also bakes in fulcro-troubleshooting, which you do not want unnecessarily increasing your bundle size in production settings. So if you want to use the template as a starting point for a production application, you will need to add those yourself.
- Can we display an error in the UI when we remove the
i-fail
resolver from Pathom? Currently it returns::p/errors ::p/not-found
, which Fulcro ignores
Copyleft © 2021 Jakub Holý
Distributed under the Unlicense.