Managing State with Re-Frame
Web Development with Clojure, Third Edition — by Dmitri Sotnikov, Scot Brown (29 / 107)
👈 Build the UI with Reagent | TOC | What You’ve Lear ned 👉
The most popular Reagent-based framework is re-frame. Re-frame places all its state in one global atom which it calls the app-db. The only way to read from the app-db is using re-frame subscriptions, and the only way to write to the app-db is by dispatching re-frame events. Note that even though the app-db can only be accessed this way, we can still include regular Reagent atoms in a re-frame application and manage them ourselves.
Let’s get re-frame set up in our guestbook application so we can see how it works. First, just like we did with cljs-ajax, let’s add it to our project’s dependencies:
guestbook-rf-intro/project.clj
[cljs-ajax "0.8.1"]
[org.clojure/clojurescript "1.10.764" :scope "provided"]
[reagent "1.0.0"]
[re-frame "1.1.2"] ;add re-frame
Restart the ClojureScript compiler:
$ lein clean
$ lein cljsbuild auto
Watching for changes before compiling ClojureScript...
And require it in our namespace declaration:
guestbook-rf-intro/src/cljs/guestbook/core.cljs
(ns guestbook.core
(:require [reagent.core :as r]
[reagent.dom :as dom]
[re-frame.core…