Oliver George 2020-09-09T04:33:30.023700Z

^ryan Boy howdy it's far from simple.

Oliver George 2020-09-09T04:33:45.024Z

Having a simple react components library with storybook does seem really nice. It cuts down on ugly interop code and helps logically separate stateless component design from piecing things together into stateful application.

Oliver George 2020-09-09T04:34:23.024600Z

Bundling it up for reuse isn't easy without experience on what's "normal". Do you bundle the npm using webpack or treat the npm as source code and configure the cljs app webpack config? I settled on the latter but unclear to me if that's good practice.

Oliver George 2020-09-09T04:35:21.025400Z

Then webpack spent 10mins doing "chunked asset optimisation" before finally throwing a "Can't resolve 'xmlhttprequest'" error.

Oliver George 2020-09-09T04:37:11.026400Z

I suspect I need to start from scratch. This app is a bit hairy.

Oliver George 2020-09-09T04:42:22.027600Z

(also too many options for bundling up styles / media files - kept that out of my webpack exploration efforts)

Oliver George 2020-09-09T04:46:38.028100Z

(plus 100 other nits along the way)

lilactown 2020-09-09T05:44:48.030Z

at my last gig we built React components in JS and used storybook to document them, and our app was in CLJS. we consumed the React components as npm libs, doing no bundling. we did have a step that compiled the JSX + some of the more modern JS syntax into ES6 or ES5, something like that

lilactown 2020-09-09T05:46:07.031400Z

at my latest gig, we are using storybook but we are building all of the components in CLJS. IMO this is much more ergonomic from the consuming side; we consume the components as a CLJS dep (aka a JAR deployed to a maven repo), which is much simpler. it does mean that we need to do more work to interop between storybook’s build tooling and CLJS

lilactown 2020-09-09T05:46:25.031700Z

there’s no real way to escape the webpack interop 😭

Oliver George 2020-09-09T05:53:50.033Z

Cool. I did wonder about transpiling(?) down to source code which could be consumed without bundling. I'd be interested in seeing a working setup for that.

lilactown 2020-09-09T06:04:50.033500Z

I think we used a pretty simple script that ran babel on the source code

lilactown 2020-09-09T06:05:31.034100Z

you really don’t want to bundle your component library because that’s going to end up including React, which ostensibly you are already including in your CLJS app

lilactown 2020-09-09T06:06:03.034700Z

to build the storybook site, that will bundle it but that’s separate from consuming it as a lib

gklijs 2020-09-09T08:03:14.038700Z

Not really a re-frame question, but didn’t know where it would fit better. In a recent discussion it was argued css frameworks are something of the past. I used re-frame with Bulma before and quite liked it. However I’m considering leaving the framework, also to have a more distinct design. I was wondering about other experiences with re-frame and a css framework, or not. Probably would go for just a ‘clean’ css based on classes with flexbox. Doesn’t need to be fancy.


@gklijs Maybe have a look at re-com


gklijs 2020-09-09T08:10:26.039500Z

Thanks, not sure it fit my use case, witch I left out, as it’s mostly a static blog/info site. And We can also confirm that none of the components have been designed with mobile in mind, and that there's no attempt to handle media queries. We said we had a desktop app focus, right? while I would want mobile first, and also very low on resources needed. But on the other hand I don’t want to spend much time on css. There is also the option of using Bulma, but cleaning the generated css of all the things I don’t use, but that also seems unnecessary complex.

Oliver George 2020-09-09T08:13:23.040400Z

@lilactown thanks. You’ve encouraged me to investigate further.

Oliver George 2020-09-09T08:22:27.041300Z

Looks like the first example in the Babel usage guide.


I have a small question about reg-fx . Is it okay to have a rf/dispatch in those, or is it better to make those normal reg-event-fx if you expect to have a dispatch there?

p-himik 2020-09-09T09:27:42.042900Z

It is OK to call rf/dispatch in effect handlers. Whether it should be preferred or not - depends on what you're doing.


I have something that has nothing to do with db , that why it feels weird to me that I am writing an event . Just some side effect which transforms the data and calls event to show the modal. Not sure why my gut feeling is against the reg-event-fx tbh

p-himik 2020-09-09T10:16:34.043300Z

Just based on that description, I don't see anything wrong with using reg-event-fx.

Lu 2020-09-09T10:18:25.043500Z

You want to have a look at codyhouse 🙂 I've been using it successfully in a web/mobile project.

Lu 2020-09-09T10:19:36.043800Z

I am using it as a backbone.. It's very easy to have pixel perfect looking components by using variables like var(--space-md) in your css

Oliver George 2020-09-09T12:40:21.045500Z

@lilactown Updating the react component library to replace webpack for a simple babel compile has given me what I wanted I think. Thanks again.

Oliver George 2020-09-09T12:40:46.046Z

Here's the update version:

Oliver George 2020-09-09T12:40:58.046300Z

Again, feedback would be gladly received.

Shako Farhad 2020-09-09T13:38:33.046400Z

If I were you, I would make the modal popup be based on your DB. I would subscribe to some key values in the db and that activates the modal.