Looking for duct+reagent app examples


#1

Hello, recently I learned about duct framework & I really liked the reloaded workflow it provides.

I see that it has cljs integration as an option, but unfortunately there is not enough code for me to make anything meaningful (pretty new to clojure).

I failed to find any examples of duct + reagent. Please share if you know any.

Thanks :slight_smile:


#2

Duct’s lein template has a +cljs option and adding reagent to that should not be too difficult. So I guess you’re figuring out how to let reagent frondend talk to Duct backend, right?


#3

Thank you for your answer :hugs:

Since morning I figured out how to connect reagent, I simply put this stuff in client.cljs:

(ns todo-list.client
  (:require [reagent.core :as r]))

(defn hello-world []
  [:h1 "Hello world"])

(r/render [hello-world]
          (-> js/document
              (.getElementById "app")))

so in the end I wrote my todo list and it was great :slight_smile:

The only problem I noticed is that page is not updated until you send (reset) to the REPL and there is no DX like in reagent starter which updates the page on each save (probably it’s because duct wants to keep fe and be in sync, I don’t know)

So it still would be great to see some real world examples (including purposes of figuring out how to talk to BE correctly & how to scale a codebase correctly)


#4

James (Duct’s author) designed the cljs compiler module to behave that way because reloading all the time can be quite annoying and I agree with him. It’s best to bind (reset) command to some keyboard shortcut in your editor.
Regarding the codebase, there’s the Duct guide as well as several docs in the project’s wiki. Also, you can get support in #duct slack channel as you learn it.
For talking to BE, there are currently several mediums to choose: RESTful api, GraphQL, EQL (a Clojure native alternative to GraphQL) or RPC (eg Castra by Hoplon team)…


#5

Duct is great for the backend. For the frontend with nice hot-reloading I would recommend you Figwheel. They should integrate well together.

I see there is a special Duct module for Figwheel, so maybe you should use that instead: https://github.com/duct-framework/server.figwheel

For talking to backend I really like Sente (websockets).


#6

The Planwise application is Duct + Reagent: https://github.com/instedd/planwise


#7

Thank you for response :slight_smile: I’m sorry it took so long to reply, wanted to clean up code a little bit

This is it if you still want to look

But basically I understood that it is possible to setup Figwheel & I will try to do it
Also Figwheel is used in the example @maridonkers provided, so I know where can I get the working example :+1:


#8

Disclaimer: I haven’t used Duct before, and I haven’t touched Lein in the last 3 years, so beware :). I had an issue with [cider/piggieback "0.3.10"]. So if my lein project doesn’t start for you, make sure to change back piggieback version to 0.3.10.

Start as you normally do:
lein repl
(dev)
(go)
(go-cljs) ;;to start Figwheel-main watch process.

Navigate to localhost:3000/example and try to make some changes in your client.cljs file to see if hot-reloading works.

This will automatically switch you to the cljs repl. So if you want to go back to your lein repl, just type :cljs/quit.

I haven’t used Duct’s figwheel module, but instead added directly the Figwheel-main library. Seems to work ok.
See my changes here: