Clojurians Log v2
off-topic
I've recently published an open source library of web components. Although it contains a lot of interesting components and demos, I felt it needed something else to demonstrate its use. As a result I am now building a web app that allows you to drag and drop web components and essentially build a UI (without state or code), It exports html or a bundle. It's pretty decent right now in quickly drafting a UI. I'm wondering what direction to take it. While the tool was initially to showcase, it now feels as if it could be more interesting if I add some features to it. I'm thinking about doing something about state or data connections between web components, I'm wondering if the end result (web components forming a UI, connected to db and events could be exported as a Clojurescript project. A dev could take that project, connect a server API, and get a working UI with source code. Any thoughts on this? ps. I do not see this as some commercial opportunity, and instead I will open source the tool. Perhaps it could be a prototyping tool of some sorts?
Yeah, people want to maintain code state in source control. You'd have smooth over that friction
So, if you could make it so that it keeps the source code updated and pretty and idiomatic, that might be compelling to some folks
It usually got messy and unmaintainable though back in the html/js wysiwyg days
Good point, need to think about that aspect.
So I don't know if you remember, but back in the day there was this interface called squeak, on top of small talk. Iirc, it was a growable interface in the sense that each view port and element had a little tag on the corner you could click on, while in edit mode, which would open a context menu that lets you "reprogram" or extend that view/element in place. Similar to those old wysiwyg website builders back in the day. Squarespace has a pretty sane drag and drop ux. But none of them were as powerful as having the full language right there on each element. I toyed with the idea with sci one time but couldn't get the nested compiler stuff going. But, what if you could "repl into" a button, just by right clicking on it? Saving the UI back to source code is a problem but you could go with pure edn representation of hiccup. Maybe a replicant type data tree
@john I can't say I've ever heard of squeak. When you say the full language on each element Do you mean you want to program the entire UI in the drag and drop interface?
I'm now experimenting with drag & drop, then letting the user define fields (e.g. cart-count, number, default 0), and linking dropped components to each other. The idea is to generate a Clojurescript project that automagically creates the src code, a db structure, sets up subscriptions and events similar to how re-frame would do it, without actually needing re-frame if you do not want it. If you do want to use re-frame, it is then trivial to include it.
As an example (see image), I set up a x-navbar, add some other web components to it, and somewhere on the right side there is an x-container I can name cart. Cart has other web components, including an x-badge that displays the nr of elements in cart. I can then add a cart-count field, and when I export everything the db, subscriptions and events are all set up, and the x-container becomes cart in the code, and the x-badge is wired up to read the ::cart.db/cart-count field from the db using a subscription.
Slowly getting there, I still need to figure out what to do with some specific things (exporting css-vars etc), but the basis is slowly getting there.
DO you think this in between version would be useful? It doesn't allow direct Clojurescript editing in the uI itself (I did think about it), but ended up trying export first.
Happy 16th of April everyone
And the Clojure Documentary drops today! Coincidence? I suspect not...
Obligatory sharing of limericks...
It's all connected