re-frame 2021-05-24 | Slack Archive

zackteo08:05:21

Hello! Is there a good resource for getting started with re-frame? Have gone through the understanding re-frame course in and I think I do grasp the general concepts already, but it still seems like a leap to start using it. Should I just try and figure it out along the way? 😮

p-himik08:05:25

The main re-frame documentation and examples.

👍 3

zackteo08:05:19

will try starting from there then hmmm

Oliver08:05:39

The re-frame documentation really helped me to understand the underlying concepts. There is a free course by Jacek Schae available here: https://www.jacekschae.com/courses/learn-re-frame-free/

🙏 6

Joni Hiltunen16:05:27

For learning purposes only, I wanna try building a simple drawing app where you can draw and drag around shapes on a HTML5 canvas... Would you suggest that I keep information about very low-level and very often updating stuff like mouse coordinates, if a button is held down or not etc in the re-frame db or should I just use reagent atoms?

p-himik16:05:10

Use app-db only for the things you consider to be a part of you app's state. To help you visualize it a bit - think of everything that might benefit from the undo/redo functionality, from the ability to save it and restore later, to serialize it in full for e.g. some reporting.

Joni Hiltunen16:05:58

right. so I would store things like active shapes in the add db but mouse coordinates etc low level details in a reagent atom or something

p-himik16:05:18

That's what I would do. But I remember at least one person saying that they store everything in app-db - mouse cursor position, animation transition states, etc.

Joni Hiltunen16:05:15

Okay, thanks for the advice. Makes more sense to me to keep very low level details outside the db

👍 3

afleck17:05:47

also in my experience keeping very rapidly changing values (e.g. scroll position) in the db can be a bit laggy

Joni Hiltunen17:05:50

Is there a way to tell re-frame/reagent to redraw the canvas when the data of a subscription changes? or should I manually call render-canvasafter adding a shape or something? https://gist.github.com/Sose/a8341b8a33e32c51d8cd3f3ad194bcb7#file-drawing-cljs-L63

p-himik17:05:42

Assuming I understand you correctly, you can simply put @shapes inside the :reagent-render, just at the very start of its body. The deref will make Reagent register this reaction and any change will trigger :component-did-update .

Joni Hiltunen17:05:58

Ahh, thanks again! That seems to work.

2021-05-24

Channels