Internship
Wrap UP
Brent Baumgartner
Summary
- Met awesome people
- Learned a lot about Clojure + Engineering
Clojurescript and you
The mother (and father) of frontend stacks.
What's Clojurescript?
Compiled Clojure into Closure-compatible Javascript
-
Dynamic, general purpose language
-
Functional
-
Efficient immutability
- Excellent state management
Google Closure?
What's that?
Why Clojurescript?
Harness the libraries and reach of Javascript,
with the power of Clojure.
Interop Example
Hello world
(.alert window "Hello, world! It's " (Date.))D3
(def svg (-> d3 (.select "body") (.append "svg")(.attr (js->clj {:width width :height height}))))(-> svg (.append "circle") (.attr (js->clj {:cx 350 :cy 200 :r 200 :class "left"}))))
React.js
Javascript library for building user interfaces
facebook.github.io/react
Why is React cool?
How can it help me?
Backbone Call stack
source: http://swannodette.github.io/assets/images/bb.jpg
React Call Stack
(with Om)
source: http://swannodette.github.io/assets/images/om.jpg
Simplicity
+
Performance
How?
-
Re-render app on each state update
-
Uses virtual DOM and smart diffing algorithm
-
Only re-render what you have to.
React.js
+
Clojurescript
=
Om
Om
Clojurescript interface to React
github.com/swannodette/om
Om
Describe UI as EDN
(defn hello-component [name]
[dom/p "Hello, " name "!"])
(defn say-hello []
[hello-component "world"])OM
- App state lives in single place
- Propagates down to components as necessary
- Components communicate through channels
- State management made simple
Next, some code.
Hello, world!
(defn hello-component [name]
(dom/p "Hello, " name "!"))
(defn say-hello []
(hello-component "world"))Lists? No problem.
(defn lister [items]
(dom/ul
{:style "color: red"}
(for [item items]
(dom/li "Item " item))))
(defn lister-user []
(dom/div
(lister (range 3)))
STate Time!
(def click-count (atom 0))
(defn counting-component []
(dom/div
"You have clicked " @click-count " times."
(dom/input {:type "button" :value "Click me!"
:on-click #(swap! click-count inc)})))Om + React simplify DOM
interaction, allowing you
to reason more effectively
about state and application
behavior.
THanks
Clojurescript and you
By Brent Baumgartner
