Building A ClojureScript SVG Toolbox
》Laments and Goals
Why do I do this to myself? The idea, so easy. The implementation, such pain.
I wanted to build a custom startpage (aka "new tab page") in my usual cyberpunk style. There are dozens and dozens of startpages out there to choose from, many of which were very stylish. But none were the phosphor green-drenched (retro?) future-styled UI my heart desired.
Well, I’ve been on this ClojureScript journey, so why not continue it?
There were a few must-haves:
An "ambient calendar" showing a year progression
A per-Firefox-instance set of URLs
Current temperature and daily high/low forecast
Today’s allergen levels
Style that would make a movie studio jealous
No ongoing animation after the page loads
Then some stretch goals:
Weather radar
Disk usage of certain systems that I need to keep an eye on
Traffic conditions and alerts
Calendar entries
And two not-haves: a search bar and a clock. CTRL-k to search is a habit. And I
friggin' hate clocks on my desktop. Long ago I learned they distract me.
Oh, this is going to be painful.
Stumbling Through Interop
》Surely I can just cargo cult this
After making so much process building a
progressive web app, I decided to take a detour into making some "simpler"
pages, without re-frame. To pull in some EDN data to work with, I quickly
needed to figure out how to use fetch. JavaScript interop looks like Java
interop, right? Objects, members, methods. What works in one place should
work in the other. Right?
》Enter promises and consternation
I started playing around just by seeing what fetch returns:
(js/fetch edn-url ) ; => #object[Promise [object Promise]]Getting a promise object in return was not a surprise. Previous work taught
me that JS uses async code and promises heavily. Which makes sense — any
blocking of a page’s JS thread leads to a frozen page. Treating the promise
like a magic bottlecap, I reach for the handy old tools realized? and deref:
(realized? (js/fetch edn-url )); => :repl/exception!
(deref (js/fetch edn-url )); => :repl/exception!Oh, no! This isn’t the same at all.
From Clojure to ClojureScript
》A Journey
How do you get from Clojure to ClojureScript? Though I have had much practice with Clojure and understand the ecosystem around it, understanding the environment of ClojureScript has remained elusive. Surely it is possible to use ClojureScript without having a deep understanding of JavaScript, just like most Clojure code can be written with minimal Java knowledge?
I had dabbled in some JavaScript before — enough to know that I would rather be writing ClojureScript if at all possible. But most of the advice given to me was along the lines of: "go learn JavaScript React and come back later." Almost as if the only people coming to ClojureScript were JavaScript developers!
Here is what I’ve learned as I struggled to put a web app together. I hope it helps other developers who might be coming from a similar background.