OM (CONT.)
@TAKUFUKUSHIMA
PRISMATIC
OM SWEET OM: (HIGH-)FUNCTIONAL
FRONTEND ENGINEERING WITH
CLOJURESCRIPT AND REACT
CONCLUSION:
SIMPLICITY WINS
PLUMBING
OM-TOOLS
THE REGULAR OM COMPNENTS ARE
VERBOSE
(defn topology-viewer [app owner]
(reify
om/IRender
(render [_]
(dom/div
(dom/svg #js...
OM-TOOLS PROVIDES USEFUL MACROS
(defcomponent topology-viewer [app owner]
(render [_]
(dom/div
(dom/svg {:width 200 :heigh...
DATASCRIPT
AN IMMUTABLE IN-MEMORY
DATABASE AND DATALOG QUERY
ENGINE IN CLOJURESCRIPT.
DATOMIC
DATALOG
(require '[datascript :as d])
;; Implicit join, multi-valued attribute
(let [schema {:aka {:db/cardinality :db.cardinality...
(d/q '[ :find ?k ?x
:in [[?k [?min ?max]] ...] ?range
:where [(?range ?min ?max) [?x ...]]
[(even? ?x)] ]
{ :a [1 7], :b [...
;; Recursive rule
(d/q '[ :find ?u1 ?u2
:in $ %
:where (follows ?u1 ?u2) ]
[ [1 :follows 2]
[2 :follows 3]
[3 :follows 4] ...
;; Aggregates
(d/q '[ :find ?color (max ?amount ?x) (min ?amount ?x)
:in [[?color ?x]] ?amount ]
[[:red 10] [:red 20] [:re...
FLIGHTDECK
GOAL: CREATE AN IN
MEMORY QUERYABLE
DB FROM THE REST API
RETRIEVE JSON DATA RECURSIVELY
;; Retrieve endpoints for resources
(defn- build-db-helper [conn endpoint]
(let [done (go
(...
BUILD IN-MEMORY DATABASE
POPULATING DATA RETRIEVED FROM
THE API SERVER
(defn build-db [root]
(let [schema {}
conn (d/creat...
(go
(let [res (<! (http/get root {:with-credentials? false}))]
(reset! api-endpoints (json-decode (res :body)))
(>! c @api...
THE END OF
SLIDES; ANY
QUESTION?
REFERENCES
▸ Prismatic: http://getprismatic.com/home
▸ Om sweet Om: (high-)functional frontend engineering
with ClojureScr...
REFERENCES
▸ Prismatic/plumbing https://github.com/prismatic/
plumbing
▸ Prismatic/om-tools https://github.com/Prismatic/
...
REFERENCES
▸ Unofficial guide to Datomic internals http://
tonsky.me/blog/unofficial-guide-to-datomic-
internals/
Other pi...
Om (Cont.)
Om (Cont.)
Om (Cont.)
Om (Cont.)
Upcoming SlideShare
Loading in …5
×

Om (Cont.)

1,036 views

Published on

This is the slides for Shibuya.lisp #18.

http://shibuya.lisp-users.org/

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,036
On SlideShare
0
From Embeds
0
Number of Embeds
31
Actions
Shares
0
Downloads
5
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Om (Cont.)

  1. 1. OM (CONT.) @TAKUFUKUSHIMA
  2. 2. PRISMATIC
  3. 3. OM SWEET OM: (HIGH-)FUNCTIONAL FRONTEND ENGINEERING WITH CLOJURESCRIPT AND REACT
  4. 4. CONCLUSION: SIMPLICITY WINS
  5. 5. PLUMBING
  6. 6. OM-TOOLS
  7. 7. THE REGULAR OM COMPNENTS ARE VERBOSE (defn topology-viewer [app owner] (reify om/IRender (render [_] (dom/div (dom/svg #js {:width 200 :height 200 :style {:backgoundColor "grey"}} (dom/circle #js {:cx 30 :cy 30 :r 25 :stroke "grey" :strokeWidth 1 :fill "wheat"}) (dom/rect #js {:width 50 :height 50 :x 60 :y 10 :style {:fill "red" :stroke "black" :strokeWidth 5 :opacity 0.5}})))))
  8. 8. OM-TOOLS PROVIDES USEFUL MACROS (defcomponent topology-viewer [app owner] (render [_] (dom/div (dom/svg {:width 200 :height 200 :style {:backgound-color "grey"}} (dom/circle {:cx 30 :cy 30 :r 25 :stroke "grey" :stroke-width 1 :fill "wheat"}) (dom/rect {:width 50 :height 50 :x 60 :y 10 :style {:fill "red" :stroke "black" :stroke-width 5 :opacity 0.5}})))))
  9. 9. DATASCRIPT
  10. 10. AN IMMUTABLE IN-MEMORY DATABASE AND DATALOG QUERY ENGINE IN CLOJURESCRIPT.
  11. 11. DATOMIC
  12. 12. DATALOG
  13. 13. (require '[datascript :as d]) ;; Implicit join, multi-valued attribute (let [schema {:aka {:db/cardinality :db.cardinality/many}} conn (d/create-conn schema)] (d/transact! conn [ { :db/id -1 :name "Maksim" :age 45 :aka ["Maks Otto von Stirlitz", "Jack Ryan"] } ]) (d/q '[ :find ?n ?a :where [?e :aka "Maks Otto von Stirlitz"] [?e :name ?n] [?e :age ?a] ] @conn)) ;; => #{ ["Maksim" 45] }
  14. 14. (d/q '[ :find ?k ?x :in [[?k [?min ?max]] ...] ?range :where [(?range ?min ?max) [?x ...]] [(even? ?x)] ] { :a [1 7], :b [2 4] } range) ;; => #{ [:a 2] [:a 4] [:a 6] [:b 2] }
  15. 15. ;; Recursive rule (d/q '[ :find ?u1 ?u2 :in $ % :where (follows ?u1 ?u2) ] [ [1 :follows 2] [2 :follows 3] [3 :follows 4] ] '[ [(follows ?e1 ?e2) [?e1 :follows ?e2]] [(follows ?e1 ?e2) [?e1 :follows ?t] (follows ?t ?e2)] ]) ;; => #{ [1 2] [1 3] [1 4] ;; [2 3] [2 4] ;; [3 4] }
  16. 16. ;; Aggregates (d/q '[ :find ?color (max ?amount ?x) (min ?amount ?x) :in [[?color ?x]] ?amount ] [[:red 10] [:red 20] [:red 30] [:red 40] [:red 50] [:blue 7] [:blue 8]] 3) ;; => [[:red [30 40 50] [10 20 30]] ;; [:blue [7 8] [7 8]]]
  17. 17. FLIGHTDECK
  18. 18. GOAL: CREATE AN IN MEMORY QUERYABLE DB FROM THE REST API
  19. 19. RETRIEVE JSON DATA RECURSIVELY ;; Retrieve endpoints for resources (defn- build-db-helper [conn endpoint] (let [done (go (let [res (<! (http/get endpoint {:with-credentials? false})) rs (json-decode (res :body))] (if (not (nil? rs)) (d/transact! conn rs)) (doseq [r rs [k v] r :when (valid-resource? k v)] (<! (build-db-helper conn v)))))] done))
  20. 20. BUILD IN-MEMORY DATABASE POPULATING DATA RETRIEVED FROM THE API SERVER (defn build-db [root] (let [schema {} conn (d/create-conn schema) c (chan) db (chan)] ;; Prevent cursor-ification. Borrowed from the following page: ;; https://gist.github.com/swannodette/11308901 (extend-type d/DB om/IToCursor (-to-cursor ([this _] this) ([this _ _] this))) ...))
  21. 21. (go (let [res (<! (http/get root {:with-credentials? false}))] (reset! api-endpoints (json-decode (res :body))) (>! c @api-endpoints))) (let [db-init (chan)] (go (let [endpoints (<! c) ks (for [[k v] endpoints :when (valid-resource? k v)] k) m (select-keys endpoints ks)] (doseq [[k v] m] (<! (build-db-helper conn v))) (>! db-init :ok))) (go (log :info "waiting for the db initialized...") (<! db-init) (log :info "done.") (prn (d/q '[:find ?id ?rid :where [_ :id ?id]] @conn)) (>! db @conn)))
  22. 22. THE END OF SLIDES; ANY QUESTION?
  23. 23. REFERENCES ▸ Prismatic: http://getprismatic.com/home ▸ Om sweet Om: (high-)functional frontend engineering with ClojureScript and React: http:// blog.getprismatic.com/om-sweet-om-high-functional- frontend-engineering-with-clojurescript-and-react/ ▸ Prismatic/schema https://github.com/Prismatic/ schema
  24. 24. REFERENCES ▸ Prismatic/plumbing https://github.com/prismatic/ plumbing ▸ Prismatic/om-tools https://github.com/Prismatic/ om-tools ▸ tonsky/datascript https://github.com/tonsky/ datascript
  25. 25. REFERENCES ▸ Unofficial guide to Datomic internals http:// tonsky.me/blog/unofficial-guide-to-datomic- internals/ Other pictures are distributed under © Taku Fukushima

×