Fork me on GitHub
#re-frame
<
2018-04-03
>
mikethompson00:04:23

@matthewdaniel we cycle around to look at it again every 6 months or so.

MegaMatt00:04:47

i see, good to know. thanks

mikethompson00:04:03

We've been a bit distracted by work on re-frame-10x

MegaMatt00:04:34

didn't realize that was new, new to reframe myself. 10x is really quite cool, much rather see work on that

soulflyer01:04:11

@danielcompton I'm trying to get the error to show up in a minimal project. No luck yet. Wondering if it might be related to electron, so minimal electron project is next.

robert-stuttaford04:04:26

@danielcompton clone https://github.com/robert-stuttaford/bridge/, cd into it, make, wait 10 seconds (lol), connect emacs cider repl to 7890, wait a few seconds for it to load stuff, (integrant.repl/reset) from the user namespace. visit localhost:8080, log in with / secret. you’ll be taken to the app. open your dev tools, the errors will be in the console.

danielcompton04:04:40

Can I do it without Cider?

robert-stuttaford04:04:53

i’ll write a function in dev/user.clj for you. ignore this until i ping you 🙂

robert-stuttaford04:04:36

btw, @danielcompton and everyone else who helped: 10x is dreamy. bravo!

robert-stuttaford04:04:54

ah, @danielcompton, once repl is connected, from the user namespace: (integrant.repl/reset)

mikethompson04:04:54

@robert-stuttaford thanks! New release pending with a few new things.

mikethompson04:04:54

Question: have you tried the code tracing yet? We're very interested in feedback.

mikethompson04:04:25

Interested and scared

robert-stuttaford04:04:37

not yet. as i start to dig into non-trivial ui stuff, i’ll switch it on and see what happens 🙂

soulflyer08:04:24

Still investigating, code tracing is working just fine in a bare bones electron/reframe project.

kurt-o-sys08:04:00

about re-frame-10x: since I'm adding some npms using webpack (it's the only way I can make some npm libs work: http://blob.tomerweller.com/reagent-import-react-components-from-npm), react is not available at the time 10x is compiled... is there a way to make 10x work with webpack? Or, more in general: is there a way to make 10x work when using npm libs that are not available in cljsjs, and which don't work using npm-deps?

danielcompton08:04:38

Hmm, that’s really not a path that we’ve trodden. I suspect you could get it working, you would just need to exclude the cljsjs JARs and add them as NPM libs

danielcompton08:04:17

I really don’t know much about this whole area, so probably can’t be much more help. If you come up with something, please let us know

kurt-o-sys08:04:56

well, the main thing I've come up with is not using lein, but try cljs-shadow. Lein has a lot of issues with npm packages (well, at least I have a lot of issues with lein and npm packaging)

kzeidler12:04:19

First cljs app in a few years, and I'm a little rusty on how to bootstrap these dev tools. @danielcompton correctly pointed out I was using the wrong key chord to activate re-frame-10x, but the correct ctrl+H key combo isn't working for me either. Is there a command to simply invoke the tools that I could wire (e.g.) to a button?

kzeidler12:04:40

I'm using the luminus skeleton with +reframe included

kzeidler12:04:57

What's the likelihood that the app's responsiveness to key events is like something that got mangled at compile time? I'm looking at the optimized .js right now and the code for detecting key events is barely recognizable as code

kzeidler12:04:16

"this.metaKey=this.shiftKey=this.altKey=this.ctrlKey=!1;" hmmmmmmm

danielcompton12:04:13

10x only support optimisations none

danielcompton12:04:33

Not sure if that’s what you’re looking for?

Vincent Cantin13:04:19

Hello. I am using LeafletJS and re-frame and I would like to add and remove markers on a map based on changes in the db. The issue I have is that the markers used by LeafletJS are not displayed via HTML nodes, a js function must be called on the LeafletJS map instead. I am not sure which pattern I should use to implement my map component. If anybody already faced that situation, please share your solution. I have 2 solutions in mind (but they seem both hacky, there must exist a better solution) : - I create a map-marker component which I use inside my map component to represent each marker data from the db, and I hook up the js functions on the mount and unmount event of the component. The problem is that I will probably have to create a useless div for each existing marker as a side effect. - In a subscription I do myself a diff on the set of marker data each time it changes, and I fire some :add-marker and :remove-marker that my map component will listen and ... I am not sure at that point.

kzeidler14:04:21

What's the idiomatic way to instantiate a Javascript object that ordinarily gets constructed with 'new'? e.g. "var sphere = new THREE.SphereGeometry(3,3,3);"

kzeidler14:04:32

Oops, forgot I was in reframe... I guess that's a better question for #clojurescript 🙂

soulflyer16:04:20

@danielcompton Found it. The 10x debux error goes away if I remove [org.clojure/spec.alpha "0.1.143"] from the :dependancies. I wasn't actually using spec yet, just had it there on the recommendation of the re-frame tutorial with the intention of using it later. Adding the spec require to my test project doesn't introduce the error so there may be some other factors I haven't yet found. Replacing and removing it in my main project does consistently cause and fix the error.

soulflyer02:04:19

My mistake. Adding spec does cause the error in a repeatable manner in my test project as long as I correctly clean out all the generated js before running cljsbuild.

planetmcd19:04:16

Is there an best practice on how manage form state in re-frame? A reagent form, a segment in the app-db? My google-fu has yielded examples but no reflections.

mikethompson19:04:52

Also i seem to remember there was a re-form library

robert-stuttaford19:04:59

@planetmcd i’ve tackled two different form setups in my bridge project, if that interests you https://github.com/robert-stuttaford/bridge/tree/master/src/bridge/event/ui

robert-stuttaford19:04:35

one is a create-form, with a form-local atom, and the other uses edit-in-place fields which handle edit/commit/cancel independently

robert-stuttaford19:04:07

for edit-in-place, i’ve got normal text done; next is dates, markdown-with-preview, and add/remove related entity reference

MegaMatt19:04:15

@mikethompson I must have missed something for when i tried to set it up it broke my project

planetmcd19:04:57

@mikethompson and @robert-stuttaford thanks for the guidance. @mikethompson I’ve looked through the docs and examples and there are a ton of great resources there and the project docs are some of the best ever. Kudos to the day8 team, it is a joy to read. I am working my way through my first go at a re-frame app and while there are lots of examples of forms, I guess I was hoping someone had thought through the tradeoffs of storing state in a ratom local to the form and then sending the values through an event vs. just storing the state in the app-db and as you change a field, update it in the db and subscribe to changes. @robert-stuttaford I am still learning so thank you for sending me along samples of both. I like your ==> and <== helpers. That is the first time I’ve seen that.

planetmcd19:04:57

I’ll take a look at re-form too. As I learn, I’m trying to understand the why’s of best practices. So again, thanks for the guidance.

robert-stuttaford21:04:23

@planetmcd https://www.stuttaford.me/2018/03/31/bridge-dev-diary--events-api/ may help you understand what i’m doing (i haven’t yet written a diary about the frontend)

robert-stuttaford21:04:02

the ==> <== look nicer if you use http://github.com/tonsky/firacode 🙂

💥 4
MegaMatt21:04:53

where are the docs for ==> i haven't seen this yet

planetmcd21:04:06

I’ll give it a look. Thanks for sharing. In case others come across this exchange and are looking for relevant libraries to help with forms, I’ve found: https://github.com/pupeno/free-form https://github.com/tomasd/re-frame-forms