3 ms·
Another Elm inspired approach is re-frame (https://github.com/Day8/re-frame https://github.com/Day8/re-frame) which is a framework for writing SPAs in Reagent (
by escherize 11y ago
Another Elm inspired approach is re-frame (https://github.com/Day8/re-frame https://github.com/Day8/re-frame) which is a framework for writing SPAs in Reagent (http://reagent-project.github.io http://reagent-project.github.io).
re-frame doesn't get enough love so here's an overview. re-frame encourages you to keep the state of your app in one map and treat it like a database. re-frame has 4 main parts:
- DB: where your global, shared state is stored. If that sounds scary and you use databases often, that's logically inconsistent. The DB is usually a map in an atom. (so it is mutable via transactions).
- Views: Reagent components. for an aweosome live example checkout http://reagent-project.github.io http://reagent-project.github.io
There are 2 ways for views to interact with the db - via dispatching handlers and subscribing to subscriptions.
- Handlers: analogous to stored procedures on the database. Handlers are pure functions that act on the database. The value returned by the handler is the new value of the DB. The handler gets registered and can be used as a high level declarative function from the views. Here's an example from our current app:
(register-handler
:cart-order-failed
(fn [db [_]]
(assoc db :cart-order-failure true)))
- Subscriptions: analogous to materialized views on the database. Allows you to watch a specific part of the state-map, do some computation, and rerun only when that specific part is updated. Here's another example:
(register-sub
:user-info
(fn [db [_]]
(reaction (->
;; never give out the password if it's there
(get @db :user)
(dissoc :password)
(dissoc :pass2)))))
So the data flows like this:
DB -> Subscription
^ |
| v
Handler <- View
The view also turns into a react.js component and is rendered to the vdom using immutable data structures, but that's Reagent not re-frame.
- dkersten 11y agore-frame doesn't get enough love Sure it does, it was pretty much the only thing talked about on the cljs mailing list for about two weeks solid. It is a fantastic library though (I'm using it right now!)
- girvo 11y agoHey neat, that's similar to how Flux works, architecture wise. It's really nice in practice, and I've been looking for an excuse to play with some front end functional languages, I'm going to check it out for sure.