ClojureScript ?

Why ClojureScript ?

  • A dialect of Clojure

  • Can compile to javascript (the feature ?)

    c2.png

Difference from Clojure

  • No STM (also n refs or agents)
  • Atoms work as in Clojure, but are single-threaded
  • No pre- and post-conditions on functions
  • ns macro has a few differences
  • Host language interoperability is slightly different

What ClojureScript Looks like?

jc.png

What ClojureScript Looks like?

m2.png

What ClojureScript Looks like?

  • cljs 

    (js/alert "Hello, world!")      ; => nil

(.log js/console "Log message") ; => nil

(.-href (.-location js/document)) ; => http://localhost/

  • js 

    alert("Hello, World!")

console.log("Log message")

document.location.href

What ClojureScript Looks like?

  • cljs example 

    (js/alert "Hello, world!")      ; => nil

(.log js/console "Log message") ; => nil

(.-href (.-location js/document)) ; => http://localhost/
  • Javascript objects live in the js namespace
  • Calling methods works as in java: (.method instance args)
  • Accessing fields of instances uses (.-fieldname instance)

c1.png

Start your first ClojureScript Project

Editors

Templates

Leinigen project for ClojureScript

Boot project for ClojureScript

How ClojureScript Compile to Javascript ?

  • Use Google Closure Compiler as backend
  • Can minified generated javascript to 4 level
    • none, simple, whitespace, advanced

Sorry, your browser does not support SVG.

A example on optimize level

(ns example.app)

(defn fn1 []
  (println "FN1!!"))

(defn ^:export fn2 []
  (println "FN2!!"))

Different optimize level: simple

simple.png

Different optimize level: advanced

adv.png

Angular.js vs. React.js vs. Vue.js

Does ClojureScript supported Angular.js/React.js/Vue.js ?

  • Yes…. but React.js has better support
  • ClojureScript has three wrapper for React.js
    omcljs/om
    ClojureScript interface to Facebook's React
    Reagent
    Minimalistic React for ClojureScript
    tonsky/rum
    Simple, decomplected, isomorphic HTML UI library for Clojure and ClojureScript

Wchich is better?

  • Well, It depends
  • It's more recommand to getting start from Reagent .

Does ClojureScript supported React-Native ?

Node.js Support

How to build ClojureScript for Node.js target ?

Just modify you :compiler setting and add :target :nodejs

nn.png

ClojureScript for Node.js use Node.js module

e1.png

Others

clj->js & js->clj

In ClojureScript, we can use clj->js and js->clj to cnovert data from js/cljs

jjs.png

Chrome tools

lein-doo

lein-doo is a library and lein plugin to run cljs.test on different js environments.

doo.png

References