Step 12 - Add Reagent

athomasoriginal · Mar 7, 2020 · e1cf66d · e1cf66d
1 parent 4c8cbd6
commit e1cf66d
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 5 deletions.
diff --git a/deps.edn b/deps.edn
@@ -4,7 +4,9 @@
  :deps
  {org.clojure/clojurescript {:mvn/version "1.10.597"}
 
-  com.bhauman/figwheel-main {:mvn/version "0.2.3"}}
+  com.bhauman/figwheel-main {:mvn/version "0.2.3"}
+
+  reagent                   {:mvn/version "0.10.0"}}
 
  :aliases
  {:dev {:main-opts ["-m"  "figwheel.main" "--build" "dev" "--repl"]}}}
diff --git a/resources/public/index.html b/resources/public/index.html
@@ -5,7 +5,8 @@
     <link rel="stylesheet" type="text/css" href="style.css" />
   </head>
   <body>
-    <h1 class="site__title"><span class="site__title-text">Time Dive</span></h1>
+    <div id="root"></div>
+
     <script src="/cljs-out/dev-main.js"></script>
   </body>
 </html>
diff --git a/resources/public/style.css b/resources/public/style.css
@@ -3,7 +3,7 @@
   --color-pink: rgba(241, 50, 50, 1);
 }
 
-body {
+#root {
   margin: 0;
   height: 100vh;
   display: flex;

diff --git a/src/tallex/time_dive.cljs b/src/tallex/time_dive.cljs
@@ -1,4 +1,19 @@
-(ns ^:figwheel-hooks tallex.time-dive)
+(ns ^:figwheel-hooks tallex.time-dive
+  (:require
+    [reagent.core :as r]))
+
+
+(defn app []
+  [:h1.site__title
+    [:span.site__title-text "Time Dive"]])
+
+
+(defn mount []
+  (r/render [app] (js/document.getElementById "root")))
+
 
 (defn ^:after-load re-render []
-  (js/console.log "Hello, Time Dive!"))
+  (mount))
+
+
+(defonce start-up (do (mount) true))