Change robots to all.

.dir-locals.el

@@ -1,5 +1,5 @@
 ((clojurescript-mode .
-                     ((cider-clojure-cli-aliases        . "-M:dev") 
+                     ((cider-clojure-cli-aliases        . ":dev") 
                       (cider-preferred-build-tool       . clojure-cli) 
                       (cider-default-cljs-repl          . custom) 
                       (cider-custom-cljs-repl-init-form . "(do (user/cljs-repl))")

deps.edn

@@ -35,9 +35,12 @@
         datascript/datascript {:mvn/version "1.5.1"}}
  :paths ["src" "resources"]
  :aliases {:build {:extra-deps {thheller/shadow-cljs {:mvn/version "2.23.3"}
-                                    #_#_binaryage/devtools {:mvn/version "1.0.7"}}
+                                #_#_binaryage/devtools {:mvn/version "1.0.7"}}
-                       :main-opts ["-m" "shadow.cljs.devtools.cli"]}
+                   :main-opts ["-m" "shadow.cljs.devtools.cli"]}
+ :dev {:extra-paths ["dev"]
+       :extra-deps {thheller/shadow-cljs {:mvn/version "2.23.3"}
+                    ;;binaryage/devtools {:mvn/version "1.0.7"}
+                    no.cjohansen/portfolio {:mvn/version "2023.07.15"}}}
            }
-           :dev {:extra-deps {thheller/shadow-cljs {:mvn/version "2.23.3"}
+
-                              ;binaryage/devtools {:mvn/version "1.0.7"}
+ }
-                              no.cjohansen/portfolio {:mvn/version "2023.07.15"}}}}

readme.org

@@ -1,17 +1,22 @@
+#+TITLE: Getting started
+
+
+* Install dependencies and start app
+#+BEGIN_SRC sh
+npm install
+#+END_SRC
+
+#+BEGIN_SRC sh
+clojure -Mbuild watch app
+#+END_SRC
+
+
 
 Future Content
 
  - Dynamic html with macro for frontend generation on build.
  - Complete frontend backend example wth ring retit reagent 
 
-#+BEGIN_SRC sh
-npm install
-#+END_SRC
-
-#+BEGIN_SRC sh
-clojure -Mbuild-dev watch app
-#+END_SRC
-
 
 https://stacksorted.com
 

resources/public/documents/about.org

@@ -6,3 +6,6 @@
 This site has various example's guides and snippets showing how to use Clojure and ClojureScript, they are mainly based on my journey learning coming from JavaScript and python having no previous experience with java or the JVM.
 
 Some of the struggles have been around Terminology & inter-op with the host languages along side re orientating my brain to think more functionally.
+
+
+https://youtu.be/LKtk3HCgTa8

resources/public/documents/hiccup-dsl-demo.org

@@ -97,19 +97,17 @@ We use map and into to convert the stats value
 (defn playing-card
   [{:keys [title image stats]}]
   [:article
-   [:div.border-solid.border-2.border-sky-500.m-4.w-100
+   [:div.border-solid.border-2.border-sky-500.m-4.w-64.rounded-lg
-    [:div.dt.w-100.mt1
+    [:div.dt.w-full
-     [:div [:h1.f5.f4-ns.mv0 title]]
+     [:div.m-4 [:h1.f5.f4-ns.mv0 title]]
-     [:img.db.w-100.h-100.br2.br--top {:src image}]
+     [:img.db.w-full.h-100.br2.br--top {:src image}]]
-
+    (into [:ul.m-4]
-     #_[:div.dtc.tr [:h2.f5.mv0 "amount"]]]
-    (into [:ul.ma2.pa2]
           (mapv (fn build-stats [[stat value]]
-                  [:li [:div stat [:div.fr (str value)]]])
+                  [:li [:div stat [:div.float-right (str value)]]])
                 stats))
-    [:p.f6.lh-copy.measure.mt2.mid-gray ""]]])
+    [:p.f6.lh-copy.measure.mt-2.mid-gray ""]]])
 
-[:div
+[:div.flex.flex-wrap
  [playing-card
   {:title "Bee"
    :image "https://loremflickr.com/300/300/bee"

resources/public/index.html

@@ -28,11 +28,7 @@
       crossorigin="anonymous"
       referrerpolicy="no-referrer"
     />
-    <link
+
-      rel="stylesheet"
-      type="text/css"
-      href="ohttps://unpkg.com/tachyons@4.12.0/css/tachyons.min.css"
-    />
     <script src="https://cdn.tailwindcss.com"></script>
     <link
       href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&family=Roboto&display=swap"
@@ -111,7 +107,7 @@
         color: #646763;
       }
     </style>
-    <meta name="robots" content="noindex" />
+    <meta name="robots" content="all" />
     <!-- Google tag (gtag.js) -->
     <script
       async

resources/public/rename-me-index.html

@@ -43,7 +43,7 @@
       top: 12px;
       right: 12px;
     </style>
-    <meta name="robots" content="noindex" />
+    <meta name="robots" content="all" />
   </head>
 
   <body>

shadow-cljs.edn

@@ -1,6 +1,6 @@
 {:deps {:aliases [:dev]}
  :dev-http {8080 ["resources/public/" "classpath:public"]}
- :source ["src" "../../components"]
+ :source ["dev" "src" "../../components"]
  :builds {:app {:output-dir "resources/public/cljs-out/"
                 :asset-path "/cljs-out"
                 :target :browser

src/clojure_demo/core.cljs

@@ -33,96 +33,10 @@
    [sci.configs.tonsky.datascript :as sci-datascript]
    [clojure-demo.routes :refer [site-data routes]]
    [clojure-demo.sitemap :as sm #_#_:refer [spit-pwa-sitemap]]
-   [tick.core :as t])
+   [tick.core :as t]
+   (clojure-demo.sci-init :refer [sci-ctx yaml-mode]))
   #_(:require-macros [clojure-demo.sitemap :as sm #_#_:refer [spit-pwa-sitemap]]))
 
-(def languages
-  {"clojure" {:mode "clojure"}
-   "clojurescript" {:mode "clojure"}
-   "html" {:mode "html"}
-   "json" {:mode "json"}
-   "yaml" {:mode "yaml"}})
-
-(def yaml-mode (LanguageSupport. (.define StreamLanguage yaml)))
-
-(defn ^:sci/macro my-js-await
-  [_ _ [name thenable] & body]
-  (let [last-expr (last body)
-        [body catch]
-        (if (and (seq? last-expr) (= 'catch (first last-expr)))
-          [(butlast body) last-expr]
-          [body nil])]
-
-    ;; FIXME: -> here will always return a promise so shouldn't be necessary to add js hint?
-    `(-> ~thenable
-         ~@(when (seq body)
-             [`(.then (fn [~name] ~@body))])
-         ~@(when catch
-             (let [[name & body] catch]
-               [`(.catch (fn [~name] ~@body))])))))
-
-;; https://github.com/babashka/sci.configs
-(def rf-ns (sci/create-ns 'reitit.frontend nil))
-(def rfe-ns (sci/create-ns 'reitit.frontend.easy nil))
-(def rss-ns (sci/create-ns 'reitit.coercion.spec nil))
-(def sql-ns (sci/create-ns 'honey.sql.core nil))
-(def sqlh-ns (sci/create-ns 'honey.sql.helpers nil))
-(def shadow-ns (sci/create-ns 'shadow.cljs.modern nil))
-(def xml-ns (sci/create-ns 'clojure.data.xml nil))
-(def tick-ns (sci/create-ns 'tick.core nil))
-
-;; core async does not work with sci
-(def async-ns (sci/create-ns 'cljs.core.async nil))
-(def async-in-ns (sci/create-ns 'cljs.core.async.interop nil))
-
-;; https://github.com/babashka/sci.configs
-(def sci-ctx
-  (sci/init
-   {:classes {'js js/globalThis :allow :all}
-    :features #{:cljs}
-    :aliases {'promesa 'promesa.core
-              'reagent 'reagent.core
-              'd 'datascript.core}
-    :namespaces
-    {'reagent.core sci-reagent/reagent-namespace
-     'reagent.ratom sci-reagent/reagent-ratom-namespace
-     ;'reagent.dom.server sci-reagent-server/namespaces
-     'promesa.core sci-promesa/promesa-namespace
-     'datascript.core sci-datascript/core-namespace
-     'datascript.db sci-datascript/db-namespace
-
-     ;'h {'html (sci/copy-var h/html hc-ns)}
-     ;'async {'go (sci/copy-var async/go async-ns)}
-     ;'shadow {'js-await (sci/copy-var js-await shadow-ns)}
-     'shadow {'js-await (sci/copy-var my-js-await shadow-ns)}
-     ;'async-in {'<p! (sci/copy-var async-in/<p! async-in-ns)}
-     'tick {'format (sci/copy-var t/format tick-ns)
-            'zoned-date-time (sci/copy-var t/zoned-date-time tick-ns)}
-     'xml {'emit-str (sci/copy-var xml/emit-str xml-ns)
-           ;; dont think indent-str & alias uri is supported in clojurescript
-           ;;'indent-str (sci/copy-var xml/indent-str xml-ns)
-           ;;'alias-uri (sci/copy-var xml/alias-uri xml-ns)
-           }
-     'sql {'format (sci/copy-var sql/format sql-ns)
-           #_#_'raw (sci/copy-var sql/raw sql-ns)}
-     'sqlh {'select (sci/copy-var sqlh/select sqlh-ns)
-            'from (sci/copy-var sqlh/from sqlh-ns)
-            'limit (sci/copy-var sqlh/limit sqlh-ns)
-            'join (sci/copy-var sqlh/join sqlh-ns)
-            'values (sci/copy-var sqlh/values sqlh-ns)
-            'on-conflict (sci/copy-var sqlh/on-conflict sqlh-ns)
-            'do-update-set (sci/copy-var sqlh/do-update-set sqlh-ns)
-            'insert-into (sci/copy-var sqlh/insert-into sqlh-ns)
-            'order-by (sci/copy-var sqlh/order-by sqlh-ns)
-            'group-by (sci/copy-var sqlh/group-by sqlh-ns)
-            'where (sci/copy-var sqlh/where sqlh-ns)}
-     'rf {'router (sci/copy-var rf/router rf-ns)}
-     'rss {'coercion (sci/copy-var rss/coercion rss-ns)}
-     'rfe {'start! (sci/copy-var rfe/start! rfe-ns)
-           'href (sci/copy-var rfe/href rfe-ns)}}}))
-
-;(def sci-ctx  (sci/empty-environment))
-(sci/alter-var-root sci/print-fn (constantly *print-fn*))
 
 (defn fetch-selected-text
   "Get the users selected text"
@@ -144,16 +58,12 @@
   (let [err-state (reagent/atom nil)]
     (reagent/create-class
      {:display-name "Error Boundary"
-;      :component-did-catch (fn [this err info] #_(reset! err-state [err info]))
       :get-derived-state-from-error (fn [e]
                                       (reset! err-state e #_[err info])
                                       #js {})
       :reagent-render (fn [children]
                         (if @err-state
-                          [:div (str @err-state)]
+                          [:div (str @err-state)] children))})))
-                          children
-                          ;(into [:<>] children)
-                          ))})))
 
 (defn code-editor
   [{:keys [exports class results]} content]
@@ -211,6 +121,19 @@
                                  "silent" ""
                                  @evaled-result)]])]))})))
 
+(defn link-handler [v _]
+  (cond
+    (str/starts-with? (str (:href v)) "https://youtu.be/")
+    [:iframe {:src (:href v)
+              :title "YouTube video player"
+              :width "560"
+              :height "315"
+              :frameborder "0"
+              :allow "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"}]
+    :else [:a {:href (:href v)} (str v)]
+    )
+  )
+
 (def theme-tachyon
   (merge tachyon-theme
          {:SRC code-editor
@@ -229,9 +152,9 @@
           :HEADER3 header-lvl3 #_(fn [v _] [:h2.text-base.lh-title.mt-0.mb-2 {:id (slugify v)} [:a {:name (slugify v)} v]])
           :LINE :p.f5.f5-ns.lh-copy.mt0
           :BULLETS :ul.mt0
-          :LINK :a #_link-handler}))
+          :LINK link-handler}))
 
-#_(def theme-toc-tachyon
+(def theme-toc-tachyon
     (merge tachyon-theme
            {:HEADER1 (fn [v _] [:li [:a {:href (str "#" (slugify v))}
                                      [:span.f4.fw6.f3-ns.lh-title.mt0.mb2 v]]])
@@ -449,7 +372,7 @@
                       (-> site-data :pages))
                 [{:title "About page" :href (rfe/href :about) :text "About" :key "about"}
                  #_{:href (rfe/href ::i-do-not-exist) :text "missing"}])]
-       [:main.m-auto {:class "w-3/5"}
+       [:main.m-auto {:class "w-3/5 md:w-4/5"}
         (when-let [view (-> @route :data :view render-view)]
           [:div
            [view @route]])]

src/clojure_demo/routes.cljc

@@ -62,7 +62,7 @@
                                :description "Using data.xml to generate a sitemap"
                                :page "example-xml-sitemap"
                                :icon-image "https://avatars.githubusercontent.com/u/2181346?s=200&v=4"}]}
-           :terminology {:title "Terminology"
+           #_#_:terminology {:title "Terminology"
                          :intro ""
                          :key :terminology}}
    :demos

src/clojure_demo/sci_init.cljs

@@ -0,0 +1,124 @@
+(ns clojure-demo.sci-init
+    (:require
+   ["@codemirror/language" :refer [LanguageSupport StreamLanguage]]
+   ["@codemirror/legacy-modes/mode/yaml" :refer [yaml]]
+   ["@codemirror/state" :as cm-state :refer [EditorState Transaction]]
+   ["@codemirror/theme-one-dark" :refer [oneDark]]
+   ["@codemirror/view" :as cm-view :refer [EditorView ViewUpdate]]
+   ["@nextjournal/lang-clojure" :refer [clojure]]
+   ["react-dom/client" :refer [createRoot]]
+   ["tarts" :as tarts]
+   [ajax.core :refer [GET raw-response-format]]
+   [cl-eorg.html :as h :refer [body headers org->replacements]]
+   [cl-eorg.parser :as o :refer [parse]]
+   [cl-eorg.themes.tachyon :refer [tachyon-theme]]
+   [clojure-demo.components
+    :refer [header-lvl1 header-lvl2 header-lvl3 notification]]
+   [clojure-demo.helpers :refer [slugify]]
+   [clojure-demo.state :refer [site-state]]
+   [clojure-demo.tailwind-theme :refer [tailwind-theme]]
+   [clojure.data.xml :as xml]
+   [clojure.string :as str]
+   [honey.sql :as sql]
+   [promesa.core :as promesa]
+   [honey.sql.helpers :as sqlh]
+   [reagent.core :as reagent]
+   [reitit.coercion.spec :as rss]
+   [reitit.frontend :as rf]
+   [reitit.frontend.easy :as rfe]
+   [reitit.frontend.history :refer [ignore-anchor-click?]]
+   [sci.core :as sci]
+   [sci.configs.funcool.promesa :as sci-promesa]
+   [sci.configs.reagent.reagent :as sci-reagent]
+   [sci.configs.tonsky.datascript :as sci-datascript]
+   [clojure-demo.routes :refer [site-data routes]]
+   [clojure-demo.sitemap :as sm #_#_:refer [spit-pwa-sitemap]]
+   [tick.core :as t]))
+
+(def languages
+  {"clojure" {:mode "clojure"}
+   "clojurescript" {:mode "clojure"}
+   "html" {:mode "html"}
+   "json" {:mode "json"}
+   "yaml" {:mode "yaml"}})
+
+(def yaml-mode (LanguageSupport. (.define StreamLanguage yaml)))
+
+(defn ^:sci/macro my-js-await
+  [_ _ [name thenable] & body]
+  (let [last-expr (last body)
+        [body catch]
+        (if (and (seq? last-expr) (= 'catch (first last-expr)))
+          [(butlast body) last-expr]
+          [body nil])]
+
+    ;; FIXME: -> here will always return a promise so shouldn't be necessary to add js hint?
+    `(-> ~thenable
+         ~@(when (seq body)
+             [`(.then (fn [~name] ~@body))])
+         ~@(when catch
+             (let [[name & body] catch]
+               [`(.catch (fn [~name] ~@body))])))))
+
+;; https://github.com/babashka/sci.configs
+(def rf-ns (sci/create-ns 'reitit.frontend nil))
+(def rfe-ns (sci/create-ns 'reitit.frontend.easy nil))
+(def rss-ns (sci/create-ns 'reitit.coercion.spec nil))
+(def sql-ns (sci/create-ns 'honey.sql.core nil))
+(def sqlh-ns (sci/create-ns 'honey.sql.helpers nil))
+(def shadow-ns (sci/create-ns 'shadow.cljs.modern nil))
+(def xml-ns (sci/create-ns 'clojure.data.xml nil))
+(def tick-ns (sci/create-ns 'tick.core nil))
+
+;; core async does not work with sci
+(def async-ns (sci/create-ns 'cljs.core.async nil))
+(def async-in-ns (sci/create-ns 'cljs.core.async.interop nil))
+
+;; https://github.com/babashka/sci.configs
+(def sci-ctx
+  (sci/init
+   {:classes {'js js/globalThis :allow :all}
+    :features #{:cljs}
+    :aliases {'promesa 'promesa.core
+              'reagent 'reagent.core
+              'd 'datascript.core}
+    :namespaces
+    {'reagent.core sci-reagent/reagent-namespace
+     'reagent.ratom sci-reagent/reagent-ratom-namespace
+     ;'reagent.dom.server sci-reagent-server/namespaces
+     'promesa.core sci-promesa/promesa-namespace
+     'datascript.core sci-datascript/core-namespace
+     'datascript.db sci-datascript/db-namespace
+
+     ;'h {'html (sci/copy-var h/html hc-ns)}
+     ;'async {'go (sci/copy-var async/go async-ns)}
+     ;'shadow {'js-await (sci/copy-var js-await shadow-ns)}
+     'shadow {'js-await (sci/copy-var my-js-await shadow-ns)}
+     ;'async-in {'<p! (sci/copy-var async-in/<p! async-in-ns)}
+     'tick {'format (sci/copy-var t/format tick-ns)
+            'zoned-date-time (sci/copy-var t/zoned-date-time tick-ns)}
+     'xml {'emit-str (sci/copy-var xml/emit-str xml-ns)
+           ;; dont think indent-str & alias uri is supported in clojurescript
+           ;;'indent-str (sci/copy-var xml/indent-str xml-ns)
+           ;;'alias-uri (sci/copy-var xml/alias-uri xml-ns)
+           }
+     'sql {'format (sci/copy-var sql/format sql-ns)
+           #_#_'raw (sci/copy-var sql/raw sql-ns)}
+     'sqlh {'select (sci/copy-var sqlh/select sqlh-ns)
+            'from (sci/copy-var sqlh/from sqlh-ns)
+            'limit (sci/copy-var sqlh/limit sqlh-ns)
+            'join (sci/copy-var sqlh/join sqlh-ns)
+            'values (sci/copy-var sqlh/values sqlh-ns)
+            'on-conflict (sci/copy-var sqlh/on-conflict sqlh-ns)
+            'do-update-set (sci/copy-var sqlh/do-update-set sqlh-ns)
+            'insert-into (sci/copy-var sqlh/insert-into sqlh-ns)
+            'order-by (sci/copy-var sqlh/order-by sqlh-ns)
+            'group-by (sci/copy-var sqlh/group-by sqlh-ns)
+            'where (sci/copy-var sqlh/where sqlh-ns)}
+     'rf {'router (sci/copy-var rf/router rf-ns)}
+     'rss {'coercion (sci/copy-var rss/coercion rss-ns)}
+     'rfe {'start! (sci/copy-var rfe/start! rfe-ns)
+           'href (sci/copy-var rfe/href rfe-ns)}}}))
+
+;(def sci-ctx  (sci/empty-environment))
+(sci/alter-var-root sci/print-fn (constantly *print-fn*))