TL;DR I created a boilerplate project that runs ClojureScript in Middleman. This project and all its pieces help me to create prototypes quickly and deploy them to heroku. This it not a tutorial. For that, view the README. Go straight to the repo here or run
git clone firstname.lastname@example.org:andreortiz82/middlemancljs.git 👍
Just over a year ago I was actively looking for solutions to help me bring ClojureScript into my workflow. I had already started working with ClojureScript via Leiningen - that was, eh. I had plenty of experience with React and Vue via the Middleman External Pipeline but when it came to finding a workflow I enjoyed, I struggled.
I came across an article by Bob Nadler where he walks through his setup. To be honest, it was easy. Stupid easy, in fact - I mumbled obscenities to myself for not figuring it out sooner. Since then I've been tweaking a boilerplate project for rapid prototyping. As of today, the project itself is a basic stub for anything I want to get off the ground. I find this template incredibly useful for my current day workload and I hope you do as well. So, without further ado - let's jump in.
Note: This project will continue to grow as I continue to learn. Please be patient as we travel together. It'll be fun.
Having the right tools is half of the work.
If you're familiar with Middleman you will quickly recognize the project structure. The only additional folder is the
Also included in this project are a series of
SCSS utilities and vars for quickly building UI. If you've ever used Foundation, Bootstrap or any n number of these projects - you'll understand what's going on. If you haven't used any of these Style Guides, I strongly suggest taking a look. There are plenty of patterns to familiarize yourself with.
These CSS util classes
# Haml .flex.white.bg-navy.p-10 .box.bg-green.p-10 Box .box.bg-green-10.p-10 Box .box.bg-green-20.p-10 Box .box.bg-green-30.p-10 Box
On the ClojureScript side, I could have used Reagent or OM but I didn't - I used Rum. Why? Because I like the syntax and the name. Engineering decisions at work 💥
IMO Rum is a fantastic React wrapper with a delightful syntax. To be clear, I've struggled a bit since stepping into the ClojureScript world but when I work with Rum, I just get it. Is the superior? Probably not when compared to other wrappers/frameworks but thats ok.
Right now you are experiencing this project in action. Below you'll find a simple Rum component that increments a number and is totally useless 🤨
I don't want to get into a full tutorial here as I will do my best to keep the README up-to-date. If you're jumping into ClojureScript as a beginner, take a look at this project and start poking around.
Please feel free to ping me on Github if you have any questions or run into trouble. Thanks for reading.