The goal of this talk is to give a general information about clojurescript language and how it can be used in modern front-end development.

1. The What, Why and How of
ClojureScript

2. Ivan Bokii
Full-stack developer in
B2M Solutions
@ivanbokii
bokiyis@gmail.com

3. What

4. What

5. What

6. What
David NolenRich Hickey

7. What
Cisco
Prismatic
CircleCI
eBay

8. What
(println “Hello World”)

9. What
(defn foo [a b]
(* a b))

10. What
(defn foo [a b]
(* a b))

11. What
(defn foo [a b]
(* a b))

12. What
(defn foo [a b]
(* a b))

13. What
(defn get-name [{:keys [first last]}]
(str first " " last)))
(get-name {:first "Ivan" :last "Bokii" :something 42})
function getName(obj) {
var first = obj.first;
var last = obj.last;
return first + " " + last;
}
getName({first: "Ivan", last: "Bokii", something: 42});

14. What
(defn build-items [coll fun & params]
(for [index-value (to-indexed coll)]
(apply fun index-value params)))

15. What
Figwheel
core.async
Reagent
Om
cljs.test
Datascript
re-frame

16. Figwheel Demo

17. What
• FP language
• Dynamically typed
• LISP
• Compiles down to JS
• Has a rich ecosystem
• Subset of clojure

18. WHY

19. WHY
REPL-driven
development

20. WHY
Communicating sequential
processes
(CSP)
core.async

21. WHY

22. WHY
function getFromServer() {
return $.getJson(“URL”);
}
async function syncExample() {
console.log(“First”);
console.log(await getFromServer());
console.log(“Second”);
}
ES7/Babel.js

23. WHY
(defn get-from-server []
(GET “URL” {:handler #(put! channel %)})
channel))
(defn sync-example []
(go
(println "First")
(println (<! (get-from-server)))
(println "Second")))

24. WHY
Features

25. WHY
Immutability

26. WHY

27. WHY
function foo (arg) {
first(arg)
second(arg)
third(arg)
}
function first (arg) {
arg.message = “why so serious?”
}

28. WHY
(defn foo [arg]
(first arg)
(second arg)
(third arg))
(defn first [arg]
(assoc arg :message “why so serious?”))

29. WHY
Immutability is great because
• Understanding
• Testability
• Equality

30. WHY
Persistent data structures
[0 1 2 3 4 5 6]
[0 1 2 3 4 5 6 7 8 9]
The pink coloured nodes are shared
between the vectors, whereas the
brown and blue are separate.

31. WHY
The pink coloured nodes
are shared between the
vectors, whereas the brown
and blue are separate.
Persistent data structures

32. WHY
Lazy sequences

33. WHY
Lazy sequences
Function that produces values wrapped
into a sequence interface
(take 10 (fibonacci-producer))
Infinite collection (or very big one)

34. WHY
Lazy sequences
var hugeCollection = [1, 2, 3, … 10^9];
function getTransformer(collection) {
return _(collection).map(function(v) { return v * 2; }
}
var transformed = getTransformer(hugeCollection);
transformed.take(10).value();

35. WHY
Lazy sequences
var hugeCollection = [1, 2, 3, … 10^9];
function getTransformer(collection) {
return _(collection).map(function(v) { return v * 2; }
}
var transformed = getTransformer(hugeCollection);
transformed.take(10).value(); //1,000,000,000

36. WHY
Lazy sequences
(def huge-collection [1 2 3 … 10^9])
(defn get-transformer [collection]
(map #(* 2 %) collection))
(let [transformed (get-transformer huge-collection)]
(take 10 transformed))

37. WHY
Lazy sequences
(def huge-collection [1 2 3 … 10^9])
(defn get-transformer [collection]
(map #(* 2 %) collection)
(let [transformed (get-transformer huge-collection)]
(take 10 transformed)) //10

38. WHY
Macros

39. WHY
Macros
Lisp code is DATA
(take 10 collection)
0 1 2

40. WHY Times of Clojure
read
macro-expansion
compile

41. WHY
(template
<div>
<h1>HELLO WORLD, {{message}}</h1>
</div>
{:message "Pixel"})

42. WHY
(reverse
(nltnirp "dlrow olleH"))

43. WHY
• CSP
• Nice features
• REPL-driven development
• immutable data structures
• lazy sequences
• macros

44. HOW

45. HOW
Editors
&
Resources to start

46. HOW
Editors
It’s important to pick the right one

47. HOW
Emacs

48. HOW

49. HOW

50. HOW
Clojure Cursive

51. HOW

52. HOW
LightTable

53. HOW

54. HOW
Plugins for
SublimeText & Atom

55. HOW
Resources to start
Learn Clojure, get ClojureScript for free

56. HOW
Web

57. HOW
http://www.braveclojure.com

58. HOW
http://clojurekoans.com
http://clojurescriptkoans.com

59. HOW http://www.parens-of-the-dead.com

60. HOW
Books

61. HOW

62. THANK YOU
@ivanbokii
bokiyis@gmail.com