Re-frame simple click counter

re-frame-click-counter

(ns simple.core
  (:require [reagent.dom :as reagent]
            [re-frame.core :as rf]))


;; -- Domino 1 - Event Dispatch -----------------------------------------------

(defn dispatch-click
  []
  (rf/dispatch [:click-count]))  ;; send event `:click-count`


;; -- Domino 2 - Event Handlers -----------------------------------------------

(rf/reg-event-db
  :initialize                  ;; id for initialize event 
  (fn [_ _]                    ;; arguments: [db event]
    {:counter 0}))             ;; set start value to 0

(rf/reg-event-db
  :click-count    
  (fn [db [_ _]]      
    (update db :counter inc)))  ;; increase counter 


;; -- Domino 4 - Query  -------------------------------------------------------

(rf/reg-sub
  :count               ;; query id (used later in subscribe)
  (fn [db _]
    (:counter db)))     ;; the function which will compute the query


;; -- Domino 5 - View Functions ----------------------------------------------

(defn view
  []
  [:div
    "The value of " [:code "app-db"] " currently is: "
   @(rf/subscribe [:count]) " "
   [:input {:type "button" :value "+"
           :on-click dispatch-click}]])


;; -- Entry Point -------------------------------------------------------------

(defn ^:export run
  []
  (rf/dispatch-sync [:initialize])     ;; puts a value into application state
  (dom/render [view]              ;; mount the application's ui into '<div id="app" />'
                  (js/document.getElementById "app")))

(run)