Hacker News Reader

Comment by cljs-js-eval | Hacker News Reader

You should check out CLJS's reagent. It mixes the best of both worlds, everything is a plain CLJS object without special syntax, but it's also obviously HTML/CSS:

  [:div {:style {:display "flex", :flex-direction "row"}}
   [:label {:for "email"}]
   [:input {:type "text"}]]

View on HN

That looks really ugly IMHO, compared to JSX which is more HTML-like.

Perhaps it might look better if there's a bigger example?

> That looks really ugly IMHO, compared to JSX which is more HTML-like.

The point of this is not of asthetics, (IMO it’s not that ugly :-)) but more that it just consists of common data structures that is easy to manipulate. If you’re a React person, think of directly writing JSON instead of using indirect React.createElement calls. Writing components in JSON would be impractical; (actually it might not be - I think I’ve seen blogposts using React without JSX) but writing components in cljs data structures are practical and less tooling is needed!

is this much different than JSX?

    <div style="display: flex; flex-direction: row">
        <label for="email"/>
        <input type="text"/>
    </div>

I definitely want to try CLJS some time.

edit Oh I see. You don't need the extra {} to jump into JS mode. And, CLJS requires : to denote keys. I think as long as my editor colors the syntax appropriately I'm okay with either.

Not really - and that's why I like it. I like JSX too.

The difference is that in the cljs version you are writing clojure at all times using clojure data structures and types (vector, map, keyword, string) which lets you manipulate and generate things easily, and, you don't have to jump between "jsx" mode and "JS" mode.

This is a major reason why I've left JS behind for CLJS. Reagent code is really just data. It acts like data, you can treat it like data. Sure, it's all well and good to say "code is data and data is code," but in reality doesn't usually work that way quiet so simply. But it does work that way in Lisp.

Compare to alternatives like Om, where the code looks like, well, code. Except in reality it's just Lisp sequences instead of Lisp vectors, so you still get all the same abilities to treat code like data. I don't think I'll ever willingly go back to JS. Maybe Purescript once of these days, but never JS.

Additionally, re-frame is absolutely wonderful and I cannot believe I waited as long as I did to switch to CLJS considering how much I prefer re-frame (and reagent) it over Redux (and React). Writing JS for immutability feels like such a chore now (Immer helps), since that part already just works in Clojure.

Also the CLJS you see is using the vectors and hashmaps of the language, meaning much more direct manipulation the same way you'd program any other datastructure.

The :display is a keyword, which works like keywords in Ruby or Erlang; it's a special, never-garbage-collected string for when you use the same string over and over. Though I'm not sure whether the implementation is the same when compiling to Javascript instead of the JVM.

Reply on news.ycombinator.com