Event streams all the way down

Preview:

Citation preview

Event streams all

the way down

@paulswilliamsuk @birminghamfp

@blackpepperltd

Not a Clojure intro

Clojure is a lisp on the JVM

React.JS knowledge?

Let’s start with an example

re-framea framework that enables standard React.js components,

written as functions, to bind one way to reactions, which are streams upon app state.

single tree state similar to redux

Takes inspiration from Elm Lang

html > events > event handlers > app-db > subscriptions > html

As all lisp-heads say

Let’s start with the data so…

Let’s look at app-db

@re-frame.db/app-db

"It is better to have 100 functions operate on one data structure than 10 functions on 10 data structures." —Alan Perlis

but Clojure data is immutable?

AtomsAtoms provide a way to manage shared, synchronous,

independent state. They are a reference type like refs and vars. You create an atom with atom, and can access its state

with deref/@.

@re-frame.db/app-db

So let’s swap!

(swap! re-frame.db/app-db assoc :server-add-status :requested)

(swap! re-frame.db/app-db assoc :server-add-status :success)

html > events > event handlers > app-db > subscriptions > html

One way data bind

The view is a React component written as a function

And they nest

Subscriptions are a form of indirection

Could transform data to aid view logic

And that’s half of the client flow

views > events > event handlers > app-db > subscriptions > views

Downward event flow

Back to the view…

And the event handler is a function that implicitly replaces app-db

views > events > event handlers > app-db > subscriptions > views

@re-frame.db/app-db

And back to the server...

Datomic events at in the DB

Records data

As facts

And replaces facts transactionally

Time based queries are simpler

Let’s travel time…

And a quick sniff around the whole solution

Tech stack review

re-frame reagent React.js

Ring Datomic

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

What I like immutability fast simple live repl + figwheel React

// todo Clojure hands on? Follow on Datomic session? WebSocket stream - SSE Date picker More HighCharts / fields Publish code

Links http://www.infoq.com/presentations/Simple-Made-Easy

https://facebook.github.io/react/docs/tutorial.html https://github.com/Day8/re-frame

https://github.com/paulspencerwilliams/paul-reduce https://github.com/paulspencerwilliams/paul-reduce/tree/datomic-pro

http://gigasquidsoftware.com/blog/2015/08/15/conversations-with-datomic/

Questions?

Recommended