Implement hashless routing

project.clj

@@ -1,6 +1,8 @@
 (defproject spa-routing "0.1.0-SNAPSHOT"
   :dependencies [[org.clojure/clojure "1.8.0"]
                  [org.clojure/clojurescript "1.9.908"]
+                 [kibu/pushy "0.3.8"]
+                 [bidi "2.1.2"]
                  [reagent "0.7.0"]
                  [re-frame "0.10.1"]
                  [secretary "1.2.3"]]

resources/public/_redirects

@@ -0,0 +1 @@
+/* / 200

src/cljs/spa_routing/core.cljs

@@ -1,12 +1,18 @@
 (ns spa-routing.core
   (:require [reagent.core :as reagent]
             [re-frame.core :as re-frame]
+            [pushy.core :as pushy]
+            [bidi.bidi :as bidi]
             [spa-routing.events]
             [spa-routing.subs]
             [spa-routing.routes :as routes]
             [spa-routing.views :as views]
             [spa-routing.config :as config]))
 
+(defn start-routing! []
+  (pushy/start! (pushy/pushy #(re-frame/dispatch [:set-active-panel %])
+                             #(:handler (routes/match %)))))
+
 (defn dev-setup []
   (when config/debug?
     (enable-console-print!)
@@ -18,7 +24,7 @@
                   (.getElementById js/document "app")))
 
 (defn ^:export init []
-  (routes/app-routes)
+  (start-routing!)
   (re-frame/dispatch-sync [:initialize-db])
   (dev-setup)
   (mount-root))

src/cljs/spa_routing/routes.cljs

@@ -1,29 +1,11 @@
 (ns spa-routing.routes
-  (:require-macros [secretary.core :refer [defroute]])
-  (:import goog.History)
-  (:require [secretary.core :as secretary]
-            [goog.events :as events]
-            [goog.history.EventType :as EventType]
-            [re-frame.core :as re-frame]))
+  (:require
+   [bidi.bidi :as bidi]))
 
-(defn hook-browser-navigation! []
-  (doto (History.)
-    (events/listen
-     EventType/NAVIGATE
-     (fn [event]
-       (secretary/dispatch! (.-token event))))
-    (.setEnabled true)))
+(def routes
+  ["/" {"" :home-panel
+        "about" :about-panel}])
 
-(defn app-routes []
-  (secretary/set-config! :prefix "#")
-  ;; --------------------
-  ;; define routes here
-  (defroute "/" []
-    (re-frame/dispatch [:set-active-panel :home-panel]))
+(def match (partial bidi/match-route routes))
 
-  (defroute "/about" []
-    (re-frame/dispatch [:set-active-panel :about-panel]))
-
-
-  ;; --------------------
-  (hook-browser-navigation!))
+(def path (partial bidi/path-for routes))

src/cljs/spa_routing/views.cljs

@@ -1,5 +1,6 @@
 (ns spa-routing.views
-  (:require [re-frame.core :as re-frame]))
+  (:require [re-frame.core :as re-frame]
+            [spa-routing.routes :as routes]))
 
 
 ;; home
@@ -8,15 +9,15 @@
   (let [name (re-frame/subscribe [:name])]
     (fn []
       [:div (str "Hello from " @name ". This is the Home Page.")
-       [:div [:a {:href "#/about"} "go to About Page"]]])))
+       [:div [:a {:href (routes/path :about-panel)} "go to About Page"]]])))
 
 
 ;; about
 
 (defn about-panel []
   (fn []
     [:div "This is the About Page."
-     [:div [:a {:href "#/"} "go to Home Page"]]]))
+     [:div [:a {:href (routes/path :home-panel)} "go to Home Page"]]]))
 
 
 ;; main