What's the state of the art or how-to for using devcards with screen-wide interfaces?
so far I've found the "Don't" method to work pretty ok
Anyone here been able to use devcards effectively with re-frame?
the standard solution at the moment is to wrap the component into iframe
stateless, noninteractive components don't have trouble of course
@macroz: Cool, thanks! Using "dumb", stateless components seems like a nice approach in general. How does the iframe solution work?
I didn't go as far as to resort to them myself, I imagine it's just having a separate page for each of your cards and then having an index page that iframes the parts so that you have one big guide
that's not as nice as it could be, maybe someone has a better solution
there seems to be some work for the support here https://github.com/bhauman/devcards/compare/master...nberger:iframe-devcard
also perhaps re-frame will go from global state to somewhere in the future, who knows 🙂
@macroz: Thanks again for the help! I read through some issues on devcards and re-frame and it indeed seems like there is at least some plan to avoid global state in re-frame at some point
@nberger: I believe you have done the "devcard iframe" support? how is it going?
@macroz: So you're mostly taking the dumb/skinny/stateless component approach for re-frame and devcards?
yeah I was quite happy even without the interactivity, my component guide contains static rendered states and the interactivity can mostly be tested in pure handler logic
so there's always a presentational component to document/render in different states
that is a pure function
handlers can be tested as pure functions
I test the interaction of it all in the app itself until there is a solution
if the list doesn't have much to itself, I may skip it and just have one task
but sometimes there's styling to it that is useful to add
this is generally the approach from React https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0#.jop8u2ghm
@macroz: Thanks again for the help. I actually just started reading that article when searching for info on this stuff!
np, I think that general idea is worthwhile and well explained there
once you start on that path you'll notice that you can build higher order components nicely that do much of the "container" stuff
e.g. wiring from a certain path in the state
@macroz: @curlyfry yes, I've been using devcards with re-frame from that branch. It's far from being perfect but it works. We use it for an app that is in production, we have devcards in 6 different namespaces, some of them include around 10 devcards. It's nice to be able to have them on the same page, rendering components in different states and being able to interact with them isolated from each other
There is a namespace with some simple examples if you want to play with them