Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
ClojureScript
Jakub Kočí
Clojure(Script)
• 2007 - Clojure
• LISP , funkcionální, dynamický
• hostovaný (JVM, .NET, JS - ClojureScript)
• 2011 - Clo...
Clojure(Script) - syntaxe
;; identifier

(def x 1)

;; => 2

;; functions

(+ 1 2 3)

;; => 6



;; function declaration

...
Clojure(Script) - datové struktury
;; list

(1 2 3 4)



;; vector

[1 2 3 4]



;; map

{:a 1 :b 2 :c 3 :d 4}



;; set

...
JavaScripte, přede mnou se neschováš
;; constructor

(def date (js/Date. “2016-09-09"))
(def regexp (js/RegExp. "^foo$"))
...
JavaScripte, přede mnou se neschováš
;; parsing between js objects/arrays and cljs maps/vectors

(def js-object (clj->js {...
Reagent + Re-frame jako React + Redux
(def initial-state {:records []

:record {}})



(register-sub :record-query

(fn [d...
Reagent + Re-frame jako React + Redux
(register-handler :save-record

(fn [db _]

(POST

(str backend-url "/records")

{:h...
Proč je to super?
• Google Closure Library + spousta Clojure funkcí
• Google Closure Compiler
• nepotřebujete HTML ani CSS...
A když to nestačí…
• Material-UI, cljs-react-material-ui
• ClojureScript + Clojure + Datomic = super-full-stack
• React Na...
Není všechno zlato co se třpití
• syntaxe a funkcionální přemýšlení
• málo zdrojů (oproti JS nesrovnatelně)
• "^{:key inde...
Stále jsem trochu skeptický…
ClojureScript for Skeptics - Derek Slager
Chci to vyzkoušet
• ClojureScript.io
• KLIPSE
• Figwheel
Díky za pozornost
jakub.koci@gmail.com
@jakubkoci
*Jo a taky nabíráme (iOS, web, backend - Scala, Java)
Dotaz na dotazy
Upcoming SlideShare
Loading in …5
×

ClojureScript

293 views

Published on

Lighting talk o ClojureScript z ne-konference jOpenSpace 2016

Published in: Technology
  • Be the first to comment

  • Be the first to like this

ClojureScript

  1. 1. ClojureScript Jakub Kočí
  2. 2. Clojure(Script) • 2007 - Clojure • LISP , funkcionální, dynamický • hostovaný (JVM, .NET, JS - ClojureScript) • 2011 - ClojureScript • Clojure kompilovaný do JavaScriptu • Browser, NodeJS
  3. 3. Clojure(Script) - syntaxe ;; identifier
 (def x 1)
 ;; => 2
 ;; functions
 (+ 1 2 3)
 ;; => 6
 
 ;; function declaration
 (defn sum [a b c]
 (+ a b c))
 
 ;; function call
 (sum 1 2 3)
  4. 4. Clojure(Script) - datové struktury ;; list
 (1 2 3 4)
 
 ;; vector
 [1 2 3 4]
 
 ;; map
 {:a 1 :b 2 :c 3 :d 4}
 
 ;; set
 #{1 2 3 :foo :bar}
  5. 5. JavaScripte, přede mnou se neschováš ;; constructor
 (def date (js/Date. “2016-09-09")) (def regexp (js/RegExp. "^foo$")) 
 ;; method calls
 (.log js/console "Hello, World!")
 
 ;; access properties
 (.-name user) (set! (.-name user) "John")

  6. 6. JavaScripte, přede mnou se neschováš ;; parsing between js objects/arrays and cljs maps/vectors
 (def js-object (clj->js {:name "John" :age 20}))
 ;; => {name: "John", age: "20"}
 
 (def json "{"name": "John", "age": "20"}")
 (def cljs-map (js->clj (js/JSON.parse json)))
 ;; => {:name "John" :age "20"} ;; DOM manipulation
 (def box (.getElementById js/document “box"))
 
 (def title (.createElement js/document "span"))
 (.appendChild box title)
  7. 7. Reagent + Re-frame jako React + Redux (def initial-state {:records []
 :record {}})
 
 (register-sub :record-query
 (fn [db _]
 (reaction (:record @db)))) 
 (defn record-form []
 (let [record (subscribe [:record-query])]
 [:div.record-form
 [:input {:type "text"
 :value (:title @record)}]
 [:button {:type "button"
 :on-click #(dispatch [:save-record])} "Save"]]))
  8. 8. Reagent + Re-frame jako React + Redux (register-handler :save-record
 (fn [db _]
 (POST
 (str backend-url "/records")
 {:handler #(dispatch [:save-record-success %1])
 :error-handler #(dispatch [:save-record-error %1])
 :format :json})
 db))
 
 (register-handler :save-record-success
 (fn [db [_ record]]
 (assoc-in db [:records] (conj (:records db) (js->clj record)))))
  9. 9. Proč je to super? • Google Closure Library + spousta Clojure funkcí • Google Closure Compiler • nepotřebujete HTML ani CSS • Immutable data • Figwheel • Hot-reload
  10. 10. A když to nestačí… • Material-UI, cljs-react-material-ui • ClojureScript + Clojure + Datomic = super-full-stack • React Native • Om, Om Next, Rum, Quiescent, Omniscient, ale néé, zase ta únava
  11. 11. Není všechno zlato co se třpití • syntaxe a funkcionální přemýšlení • málo zdrojů (oproti JS nesrovnatelně) • "^{:key index}” a teď to zkus vygúglit • chybové hlášky • no je tam ta mezivrstva JavaScriptu
  12. 12. Stále jsem trochu skeptický… ClojureScript for Skeptics - Derek Slager
  13. 13. Chci to vyzkoušet • ClojureScript.io • KLIPSE • Figwheel
  14. 14. Díky za pozornost jakub.koci@gmail.com @jakubkoci *Jo a taky nabíráme (iOS, web, backend - Scala, Java) Dotaz na dotazy

×