Clojurians Log v2

Hello! Is it possible to setup my project in such a way that devcards are created alongside the rest of the application? I'd like to have a route "/devcards" that would serve a devcards.html where the devcards are mounted.

If I don't go to /devcards, the app will work normally

Looking at the devcards-template, I get the feeling that the intended workflow is that I start with lein figwheel devcards if I want to use devcards, and then switch to lein figwheel dev if I want to use the actual app.. but that can't be right

or maybe I'm supposed to do lein cljsbuild devcards once, figwheel dev?

@kauko So figwheel can run two builds at once. lein figwheel dev cards

So you configure two builds

And run them at the same time

Hah, the man himself 😄 Ok :simple_smile:

What logic does devcards use for.. mounting itself? It feels like it just attaches itself to the page

I mean, I'm used to having a `<div id="app"></div>" somewhere, and then mounting the entry point there client-side

but it seems devcards doesn't need anything like that

just curious, that's all :simple_smile:

You need to have a separate html page to host the cards

And it creates a div to mount if it isn't there

ok!

Yeah, that's what I think I'm doing.. I mean, having a separate html page for it

I've been using clojure for a year now, but this is the first time I'm actually starting a project from scratch by myself, so I'm a bit lost still. but making progress! 😄

Woot, seems to work. Though the actual card doesn't show up. Should devcards work with Rum?

I would check to make sure you have everything setup correctly

Don't use rum to check.

Return a react element

Or just a cljs map

The most common mistake is not requiring the namespace with the cards in it.

let's see

Hmm, seems to work using the example from the github repo

the one that uses sablono and says how awesome devcards is 😉

You have to make sure that the rum expression is returning a react element.

(rum/defc input < rum/reactive [ref]
          [:input {:type "text"
                   :value (rum/react ref)
                   :style {:width 100}
                   :on-change #(reset! ref (.. % -target -value))}])

#?(:cljs
   (defcard (controls)))

That look right to you?

Could .cljc be the problem?

(ns frontendfi.views.controls
  (:require
    [rum.core :as rum])
  #?(:cljs
     (:require-macros
     [devcards.core :as dc :refer [defcard deftest]])))

Oh I forgot to name the card! Maybe that's the problem

Nope.. hmm

UGH damn I feel so stupid now 😄 😄

Of course it doesn't work, I'm not mounting anything on the client side

All this time I've just been staring at the server-side rendered components that don't actually do anything, without realising I specifically disabled mounting the rum components so that I see the server-side rendering is working

So, the first thing you mentioned WAS the problem

glad you found it :simple_smile: there's ton of shit going on here

no need to feel stupid

Hmm, if I require devcards in the components file, what can I do to not include in a production build?

I defined devcards as a development dependency in my project.clj, but lein uberjar fails now

I know I could define the cards in a separate file, and in a production build that file could be empty

but I feel like I'd prefer having the card definitions in the same file as the actual component

Hmm, I just noticed figwheel is not actually reloading the cards

for the normal app the reload works as expected