devcards

Devcards aims to provide a visual REPL experience for ClojureScript https://github.com/bhauman/devcards
shaun-mahood 2015-10-01T14:50:26.000324Z

@bhauman: I'm thinking of putting devcards into a div that I can manipulate as I work through different stages of my app - my thought is to enable a devcards flag that shows/hides the div to start, and I think I can do all that using the main function in devcards to start the app. One of the things I would like to be able to do is to add something like an "inspect" button that only shows up in my dev profile, so that I can add it to my components and then click on it and bring up the devcard for that specific component in a sidebar or modal. For now the only way I can see of doing this is using something like an iframe and loading the specific card link into it, is there a better way? I'd love to just be able to call a render function on the card or set of cards that I wanted to display.

bhauman 2015-10-01T15:33:59.000326Z

@shaun-mahood: I welcome experiments like this!! I think for now it's hard to beat the simplicity of having two builds. And switching between tabs. Also something I have done is placed the whole main application in a one card in an ns and then hid the devcards top Nav with some CSS.

bhauman 2015-10-01T15:35:20.000327Z

I do have a render namespace function. That could help its at the bottom of core.cljs

shaun-mahood 2015-10-01T15:35:35.000328Z

Oh cool, I'll play around with both of those ideas.

shaun-mahood 2015-10-01T15:38:55.000329Z

Right before you announced devcards I was mulling around some ideas like it, mainly geared towards fleshing out the information available when developing. I have a few apps I want to redo and update in clojurescript, and my thought is that I'll develop the components in devcards, then integrate the useful parts into a dev mode so that I can further instrument the completed app with documentation, examples, and well structured logging for when I go back to make changes.

shaun-mahood 2015-10-01T15:40:51.000330Z

I think it might be a great tool for realizing some of the stuff in Bret Victor's talks as well, those have been a huge inspiration to me and one of the reasons I started looking around for better ways of developing.

shaun-mahood 2015-10-01T15:49:00.000331Z

One other thing I'm really excited about for devcards is (hopefully) the ability to easily see how a site or component looks at different widths for responsive design

bhauman 2015-10-01T17:23:32.000332Z

@shaun-mahood: one thing to think about it to make your whole app a devcard in one ns. I have done that and hidden the devcards controls at the top of the page. When you make your whole app a card you can then add other cards on the page and then navigate to the other ns easily as well. One thing to work out is how to abstract routing but that should be easy enough.

shaun-mahood 2015-10-01T17:25:08.000333Z

Good idea, I'll give that a try too.

shaun-mahood 2015-10-01T19:17:17.000335Z

Not sure if this is expected behaviour or not, but when I remove the last defcard from a file that previously had one, when figwheel updates that card is still there. Disappears on a browser refresh.

bhauman 2015-10-01T20:17:59.000336Z

@shaun-mahood: that is expected behavior, for now. When there are no cards on a page it literally ceases to exist. The empty case ... always the weird one ...

shaun-mahood 2015-10-01T22:39:33.000337Z

@bhauman: As far as the CSS styles for devcards go, would it be possible/desireable to move the style definitions out to an included CSS stylesheet rather than inlining them? I'm planning on overriding some of the styles, but don't know whether inlining or separate files would be a better fit for devcards in general.

shaun-mahood 2015-10-01T22:40:10.000338Z

I'm pretty used to struggling with CSS to get things to look right, so I'm not a good judge of what things should be like when it comes to that.