diff --git a/.gitignore b/.gitignore
index 33d5be9..f9f21c9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,3 +13,5 @@ pom.xml.asc
 *.iml
 figwheel_server.log
 neo4j/*
+resources/public/js/out
+.rebel_readline_history
diff --git a/env/dev/clj/user.clj b/env/dev/clj/user.clj
new file mode 100644
index 0000000..4ba997c
--- /dev/null
+++ b/env/dev/clj/user.clj
@@ -0,0 +1,11 @@
+(ns user
+ (:require [figwheel-sidecar.repl-api :as ra]))
+
+(defn start-fw []
+ (ra/start-figwheel!))
+
+(defn stop-fw []
+ (ra/stop-figwheel!))
+
+(defn cljs []
+ (ra/cljs-repl))
diff --git a/env/dev/cljs/wanijo/frontend/dev.cljs b/env/dev/cljs/wanijo/frontend/dev.cljs
new file mode 100644
index 0000000..37ce088
--- /dev/null
+++ b/env/dev/cljs/wanijo/frontend/dev.cljs
@@ -0,0 +1,11 @@
+(ns ^:figwheel-no-load wanijo.frontend.dev
+  (:require
+    [wanijo.frontend.core :as core]
+    [devtools.core :as devtools]))
+
+
+(enable-console-print!)
+
+(devtools/install!)
+
+(core/init!)
diff --git a/env/prod/cljs/wanijo/frontend/prod.cljs b/env/prod/cljs/wanijo/frontend/prod.cljs
new file mode 100644
index 0000000..04065a0
--- /dev/null
+++ b/env/prod/cljs/wanijo/frontend/prod.cljs
@@ -0,0 +1,8 @@
+(ns wanijo.frontend.prod
+  (:require
+    [wanijo.frontend.core :as core]))
+
+;;ignore println statements in prod
+(set! *print-fn* (fn [& _]))
+
+(core/init!)
diff --git a/project.clj b/project.clj
index 7581318..9993e49 100644
--- a/project.clj
+++ b/project.clj
@@ -3,8 +3,10 @@
   :url "http://example.com/FIXME"
   :min-lein-version "2.0.0"
 
-  :dependencies [[org.clojure/clojure "1.10.0"]
+  :dependencies [;;clojure core
+                 [org.clojure/clojure "1.10.0"]
 
+                 ;; static site
                  [compojure "1.6.1"]
                  [ring/ring-defaults "0.3.2"]
                  [ring/ring-jetty-adapter "1.7.1"
@@ -17,32 +19,54 @@
                                ring/ring-codec
                                commons-io
                                commons-codec]]
-
                  [hiccup "1.0.5"]
                  [joshavg/formulare "0.4.0-SNAPSHOT"]
 
+                 ;; neo4j
                  [gorillalabs/neo4j-clj "2.0.1"
                   :exclusions [org.bouncycastle/bcprov-jdk15on
                                org.bouncycastle/bcpkix-jdk15on
                                com.github.ben-manes.caffeine/caffeine]]
+
+                 ;; additional server side libs
                  [buddy/buddy-hashers "1.3.0"
                   :exclusions [commons-codec]]
-
                  [clj-time "0.15.1"]
                  [markdown-clj "1.0.7"]
-                 [dorothy "0.0.7"]]
+                 [dorothy "0.0.7"]
+
+                 ;; fancy js fuckup
+                 [org.clojure/clojurescript "1.10.520"]
+                 [reagent "0.8.1"]]
+
+  :profiles {:dev {:dependencies [;; webserver stuff
+                                  [javax.servlet/servlet-api "2.5"]
+                                  [ring/ring-mock "0.3.2"]
+
+                                  ;; fancy js fuckup
+                                  [binaryage/devtools "0.9.10"]
+                                  [figwheel-sidecar "0.5.18"]
+                                  [nrepl "0.6.0"]
+                                  [cider/piggieback "0.4.0"]]
+                   :plugins [;; neo4j db
+                             [joshavg/lein-neo4j "0.4.0"]
 
-  :profiles {:dev {:dependencies [[javax.servlet/servlet-api "2.5"]
-                                  [ring/ring-mock "0.3.2"]]
-                   :plugins [[joshavg/lein-neo4j "0.4.0"]
+                             ;; webserver stuff
                              [lein-less "1.7.5"]
                              [lein-ring "0.12.5"]
-                             [lein-ancient "0.6.15"]
+
+                             ;; code quality
+                             [lein-ancient "LATEST"]
                              [jonase/eastwood "LATEST"]
                              [lein-bikeshed "0.5.1"]
                              [lein-cloverage "1.0.13"]
                              [cider/cider-nrepl "LATEST"]
-                             [lein-kibit "LATEST"]]}
+                             [lein-kibit "LATEST"]
+
+                             ;; fancy js fuckup
+                             [lein-cljsbuild "1.1.7"]
+                             [lein-figwheel "0.5.18"]]
+                   :source-paths ["src" "env/dev/clj"]}
              :uberjar {:aot :all
                        :main wanijo.main}}
 
@@ -52,4 +76,40 @@
   :less {:source-paths ["resources/app/stylesheets"]
          :target-path "resources/public/css"}
   :hiera {:cluster-depth 2}
-  :eastwood {:namespaces [:source-paths]})
+  :eastwood {:namespaces [:source-paths]}
+
+  :aliases {"package" ["do"
+                       "clean"
+                       ["cljsbuild" "once" "release"]
+                       ["less" "once"]]}
+
+  ;;fancy js fuckup
+  :clean-targets ^{:protect false}
+  [:target-path
+   [:cljsbuild :builds :app :compiler :output-dir]
+   [:cljsbuild :builds :app :compiler :output-to]]
+  :figwheel {;;:http-server-root "resources"
+             :nrepl-port 7002
+             :nrepl-middleware [cider.piggieback/wrap-cljs-repl]
+             :css-dirs ["resources/public/css"]
+
+             :ring-handler wanijo.handler/app}
+  :cljsbuild {:builds
+              {:app
+               {:source-paths ["src" "env/dev/cljs"]
+                :compiler {:main "wanijo.frontend.dev"
+                           :output-to "resources/public/js/app.js"
+                           :output-dir "resources/public/js/out"
+                           :asset-path "/js/out"
+                           :source-map true
+                           :optimizations :none
+                           :pretty-print true}
+                :figwheel {:on-jsload "wanijo.frontend.core/mount-root"
+                           :open-urls ["http://localhost:3449/index.html"]}}
+               :release
+               {:source-paths ["src" "env/prod/cljs"]
+                :compiler {:output-to "resources/public/js/app.js"
+                           :output-dir "resources/public/js/out-release"
+                           :optimizations :advanced
+                           :infer-externs true
+                           :pretty-print false}}}})
diff --git a/resources/public/js/app.js b/resources/public/js/app.js
new file mode 100644
index 0000000..d8f5c9a
--- /dev/null
+++ b/resources/public/js/app.js
@@ -0,0 +1,11 @@
+var CLOSURE_UNCOMPILED_DEFINES = {};
+var CLOSURE_NO_DEPS = true;
+if(typeof goog == "undefined") document.write('<script src="/js/out/goog/base.js"></script>');
+document.write('<script src="/js/out/goog/deps.js"></script>');
+document.write('<script src="/js/out/cljs_deps.js"></script>');
+document.write('<script>if (typeof goog == "undefined") console.warn("ClojureScript could not load :main, did you forget to specify :asset-path?");</script>');
+document.write('<script>goog.require("figwheel.connect");</script>');
+document.write('<script>goog.require("process.env");</script>');
+document.write('<script>goog.require("wanijo.frontend.dev");</script>');
+
+document.write("<script>figwheel.connect.start();</script>");
\ No newline at end of file
diff --git a/resources/public/js/frontend.js b/resources/public/js/scripts.js
similarity index 100%
rename from resources/public/js/frontend.js
rename to resources/public/js/scripts.js
diff --git a/src/wanijo/framework/view.clj b/src/wanijo/framework/view.clj
index dff4721..4ee3a98 100644
--- a/src/wanijo/framework/view.clj
+++ b/src/wanijo/framework/view.clj
@@ -23,11 +23,13 @@
    content])
 
 (defn layout!
-  [& {:keys [content title session request]
+  [& {:keys [content title session request head bottom]
       :or {content []
            title nil
            request {}
-           session nil}}]
+           session nil
+           head nil
+           bottom nil}}]
   (let [session (or session (:session request))
         ident (:ident session)
         authed? (some? ident)
@@ -40,7 +42,8 @@
       [:title (str "wan ijo" (when title (str " - " title)))]
       (include-css "/css/app.css")
       (when devmode? (include-css "/css/devmode.css"))
-      (include-js "/js/frontend.js")]
+      (include-js "/js/scripts.js")
+      head]
      [:body
       [:section.grid
        [:header
@@ -71,6 +74,8 @@
            [:section
             [:h2 [:span.__icon "▤"] "Visualisation"]
             [:ul
+             [:li [:a {:href (path :vis-index)}
+                   "Custom Visualisation"]]
              [:li [:a {:href (path :vis-all-instances)}
                    "All Instances"]]]]))]
        (into [:main
@@ -78,4 +83,5 @@
                 (flash-error msg))]
              content)
        [:footer
-        [:small "Ilo pali e ijo"]]]])))
+        [:small "Ilo pali e ijo"]]]
+      bottom])))
diff --git a/src/wanijo/frontend/core.cljs b/src/wanijo/frontend/core.cljs
new file mode 100644
index 0000000..cd7d087
--- /dev/null
+++ b/src/wanijo/frontend/core.cljs
@@ -0,0 +1,18 @@
+(ns wanijo.frontend.core
+  (:require
+   [reagent.core :as r]))
+
+;; -------------------------
+;; Views
+
+(defn home-page []
+  [:div [:h2 "Welcome to Reagent ummf"]])
+
+;; -------------------------
+;; Initialize app
+
+(defn mount-root []
+  (r/render [home-page] (.getElementById js/document "visualisation")))
+
+(defn init! []
+  (mount-root))
diff --git a/src/wanijo/home/routes.clj b/src/wanijo/home/routes.clj
index d649b4e..462b55f 100644
--- a/src/wanijo/home/routes.clj
+++ b/src/wanijo/home/routes.clj
@@ -4,4 +4,5 @@
             [wanijo.home.view :as home-view]))
 
 (defroutes routes
+  (GET "/index.html" [] home-view/root!)
   (GET (register! :home "/") [] home-view/root!))
diff --git a/src/wanijo/visualisation/routes.clj b/src/wanijo/visualisation/routes.clj
index 54aeac7..06f8867 100644
--- a/src/wanijo/visualisation/routes.clj
+++ b/src/wanijo/visualisation/routes.clj
@@ -5,8 +5,10 @@
             [wanijo.framework.routing :refer [register! path]]
             [wanijo.framework.view :as view]
             [wanijo.instance.domain :as domain-instance]
-            [wanijo.visualisation.domain :as vis-domain]
-            [wanijo.visualisation.viz :as viz]))
+            [wanijo.visualisation
+             [domain :as vis-domain]
+             [viz :as viz]
+             [view :as vis-view]]))
 
 (defn all-instances [req]
   (view/layout!
@@ -16,6 +18,9 @@
     (viz/all-instances (vis-domain/all-instance-connections!))]))
 
 (defroutes routes
+  (GET (register! :vis-index "/visualisation/index")
+       [:as req]
+       (vis-view/index req))
   (GET (register! :vis-all-instances "/visualisation/all-instances")
        [:as req]
        (all-instances req)))
diff --git a/src/wanijo/visualisation/view.clj b/src/wanijo/visualisation/view.clj
new file mode 100644
index 0000000..80982da
--- /dev/null
+++ b/src/wanijo/visualisation/view.clj
@@ -0,0 +1,11 @@
+(ns wanijo.visualisation.view
+  (:require [hiccup.page :refer [include-js]]
+            [wanijo.framework.view :as view]))
+
+(defn index [req]
+  (view/layout!
+   :request req
+   :bottom (list (include-js "/js/app.js"))
+   :content
+   [[:h1 "Visualisation"]
+    [:div#visualisation]]))