Questions tagged [re-frame]

re-frame is a pattern for writing SPAs in ClojureScript, using Reagent.

To build a re-frame app, you:

  • design your app's data structure (data layer)
  • write and register subscription functions (query layer)
  • write Reagent component functions (view layer)
  • write and register event handler functions (control layer and/or state transition layer)

Features:

  1. The functions you write are pure, so the computational pieces of your app can be described, understood and tested independently. You won't need sophisticated Dependency Injection to test. So much incidental complexity evaporates.
  2. These computational parts are composed via reactive data flows - a dynamic, unidirectional Signal graph.
  3. The resulting architecture involves "derived data" flowing in a two-stage, reactive loop. Without realising it, you will be explicitly modelling time.
  4. It is fast, straight out of the box. You won't have to go through this sort of pain.
  5. The surprising thing about re-frame is how simple it is. Beautifully simple! Our reference implementation is little more than 200 lines of (ClojureScript) code. Learn it in an afternoon.
  6. But it scales up nicely to more complex apps. Frameworks are just pesky overhead at small scale - measure them instead by how they help you tame the complexity of bigger apps.
  7. Re-frame is impressively buzzword compliant: it has FRP-nature, unidirectional data flow, pristinely pure functions, conveyor belts, statechart-friendliness (FSM) and claims an immaculate hammock conception. It also has a charming xkcd reference (soon) and a hilarious, insiders-joke T-shirt, ideal for conferences (in design).

Github

144 questions
20
votes
4 answers

Why are multi-methods not working as functions for Reagent/Re-frame?

In a small app I'm building that uses Reagent and Re-frame I'm using multi-methods to dispatch which page should be shown based on a value in the app state: (defmulti pages :name) (defn main-panel [] (let [current-route (re-frame/subscribe…
Pablo Fernandez
  • 279,434
  • 135
  • 377
  • 622
13
votes
3 answers

How do I loop through a subscribed collection in re-frame and display the data as a list-item?

Consider the following clojurescript code where the specter, reagent and re-frame frameworks are used, an external React.js grid component is used as a view component. In db.cls : (def default-db {:cats [{:id 0 :data {:text "ROOT" :test 17} :prev…
nilo de roock
  • 4,077
  • 4
  • 34
  • 62
12
votes
1 answer

What is the difference between reg-event-db, reg-event-fx and reg-event-ctx in Re-frame?

There are 3 event fns in Re-frame, I can do the same thing with both reg-event-db and reg-event-fx. What is the main difference between reg-event-db, reg-event-fx and reg-event-ctx? When should I use reg-event-fx over reg-event-db or vice versa.
Ertuğrul Çetin
  • 5,131
  • 5
  • 37
  • 76
10
votes
2 answers

Are reagent-forms meant to be using with re-frame?

I'm building an application with re-frame and I'm wondering if reagent-form are meant to be used with re-frame or not, as reagent-form brings in its own way of handling state which is different than re-frame.
Pablo Fernandez
  • 279,434
  • 135
  • 377
  • 622
8
votes
1 answer

Google Chart CLJS Clojure

I tried to adapt this example in Google Chart. To re-frame framework, reagent. I would like to create a real-time chart, based on subscriptions. I tested with a simple counter =+-1. I got error: Assert failed: Render must be a function, not…
RRR
  • 103
  • 1
  • 7
8
votes
1 answer

How do I handle input elements in Clojure Re-Frame?

I have a couple options, but both seem a bit laggy, and I'm thinking that there should be a better alternative. I just would like to be able to create forms, even dynamically create them (eg adding rows to a form from within my app), and have…
Josh.F
  • 3,666
  • 2
  • 27
  • 37
8
votes
1 answer

re-frame: Input :on-change reset! doesn't change input value

I'm playing around with the re-frame framework. In the code below, I am having trouble with updating the input value when the user types something in: (defn measurement-input [{:keys [amount unit path]}] (let [amt (atom amount)] (fn [] …
Kurt Mueller
  • 3,173
  • 2
  • 29
  • 50
7
votes
2 answers

How do I make devCards work with re-frame?

Devcards aims to provide a visual REPL experience for ClojureScript. They offer support to Reagent and OM. How can I make devCards work with re-frame?
dilvan
  • 2,109
  • 2
  • 20
  • 32
7
votes
2 answers

ClojureScript Re-frame subscription dereferencing dilemma

What's the best of following approaches? Outer subscription, early deref (defn component [msg] [:p msg])) (let [msg (rf/subscribe [:msg])] [component @msg] Outer subscription, late deref (defn component [msg] [:p @msg])) (let [msg…
jsmesami
  • 128
  • 1
  • 6
6
votes
2 answers

re-frame: No event handler registered

My re-frame views.cljs has: (re-frame/dispatch [::re-graph/init {:http-url "https://api.spacex.land/graphql" :ws-url nil :http-parameters {:with-credentials?…
jwesonga
  • 4,249
  • 16
  • 56
  • 83
6
votes
2 answers

What is correct way to broadcast secretary URL parameters to reagent component

I'm building an app on top of re-frame default template. I have following secretary route: (defroute "/users/:id" [] (re-frame/dispatch [:set-active-panel :user-panel]) I want to access id parameter from URL in my reagent component. The only way…
Boris Zagoruiko
  • 12,705
  • 15
  • 47
  • 79
5
votes
1 answer

Implementing a login system with re-frame

I am new to re-frame and not quite sure how to build a user authentication/authorization system with it. From what I gathered I should create an auth interceptor and place my auth logic inside :before section then inject the interceptor into every…
Adam
  • 2,948
  • 10
  • 43
  • 74
5
votes
1 answer

How to dispatch an event from an event in re-frame

I followed this example: https://github.com/Day8/re-frame/blob/master/docs/FAQs/PollADatabaseEvery60.md And here is my interval handler (defonce interval-handler (fn [{:keys [action id frequency event]}] (let [live-intervals (atom {})] …
5
votes
1 answer

Writing re-frame events that do not change app-db

There are certain events that do not result in app-db changing. They only change the dom, e.g: init a custom scroll, getting the selected text, etc. How should I deal with them in re-frame, since the event handler requires to return a new app-db? I…
Chin365
  • 197
  • 1
  • 5
4
votes
2 answers

Integrating Google's with React/Reagent

Google's provides all the key features I need without having write a custom solution via something like react-three-fiber or directly in three.js. I am struggling with how to properly integrate it into a Reagent (and React for that…
BorisKourt
  • 187
  • 2
  • 15
1
2 3
9 10