Well, over the break, I used the repl and hiccup to make this portfolio of some of my (almost all clj{s}) projects: esherize.com
I’d like to talk about how simple it was to build up and transform the data about my portfolio into the page that is there now. The trickiest part was figuring out how bulma css likes to have data arranged. I’m pretty happy with the result.
From a data standpoint this project is absolutely beginner friendly.
- Take a list of maps
- Apply a transformation on them from the raw and easy-to-edit data -> hiccup datastructure
- turn it into html!
Hiccup is enjoyable to use since it’s easier to manipulate the data structures with my text editor. Way easier than fussing with messy and verbose html.
Here’s the function that I mapped over the sequence of maps. Simple as~
(defn work-tile [{:keys [title explanation img-url link-url tags] :as work}]
[:div.tile.is-child.card
[:div.card-header
[:div.card-header-title title]
(when tags
[:div.tags {:style "margin-right: 20px;"}
(map (fn [t] [:div.tag.is-rounded {:class (get tag-table t)} t])
tags)])]
[:div.card-content
[:div.content explanation]
[:div.card-image
[:img {:src img-url}]]]
[:footer.card-footer
[:a.card-footer-item {:href link-url} "Visit Project"]]])
