Clojurescript - building a simple router

Wed, 15 Jan 2020 09:37:17 -0400

In this video we'll look at creating a small router.

I originally looked at using one of the available libraries to set up routing. I considered reitit and bidi but in the end decided to figure out how to do it myself.

It turns out that whenever you change the hash part of a url - everything following a # at the end of a url you get a hashchange event. You can handle that with

 (.addEventListener js/window "hashchange" #(handleroutes routes %))

where handleroutes is your function to actually handle the routes.

You can then get the actual value of that last hash part of the url with:

(.-location.hash js/window)

Once you map that to whatever function you want you update the history and mount the new page:

 (.history.replaceState js/window {} nil loc)
 (mount newpage)

All the code is up on GitHub: https://github.com/zamansky/shadow-cljs-demo

There are still things I need to figure out. Specifically, how can I route without the #. That is, I can do it, but the page reloads every time rather than just remounting the component I want.

The video goes through the entire process. Enjoy.

clojurescript on C'est la Z

Clojurescript - building a simple router