Fork me on GitHub
Danny Almeida03:04:43

Hi, where can I find the source for this example app ? Is there a getting started guide on how to create a very basic app using keechma ? The hello-world app example does not say how to put everything together and what codes goes in which file. Any help appreciated.


@dionysius.almeida RealWorld app is how we would structure a bigger app with routing, dataloading, forms


and for the simple routing app, this is the complete source:

   [reagent.ratom :refer [reaction]])
   [reagent.core :as reagent]
   [keechma.ui-component :as ui]
   [keechma.controller :as controller]
   [ :as app-state]))

(defn hello-world-routing-render [ctx]
  (let [current-name (or (get-in @(ui/current-route ctx) [:data :name]) "")]
     [:label {:for "name"} "Enter your name"]
       {:id "name"
        :on-change (fn [e] (ui/redirect ctx {:name (.-value (.-target e))}))
        :value current-name}]]

     (when (seq current-name)
       [:h1 (str "Hello " current-name)])]))

(def hello-world-routing-component
   {:renderer hello-world-routing-render}))

(def app-definition
  {:components   {:main hello-world-routing-component}
   :html-element (.getElementById js/document "app")})

(def pretty-route-app-definition
  {:components   {:main hello-world-routing-component}
   :html-element (.getElementById js/document "app")
   :routes       ["name/:name"]})

(def pretty-route-with-defaults-app-definition
  {:components   {:main hello-world-routing-component}
   :html-element (.getElementById js/document "app")
   :routes       [["" {:name "Student"}]
                  ["name/:name" {:name "Student"}]]})

Danny Almeida10:04:40

@mihaelkonjevic Thank you 👍:skin-tone-3: I managed to get the hello world app working after some messing around. I'm new to front-end world, so exploring a few options including keechma and fulcro. Cheers 🙂