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
4
votes
0 answers

Cljs Re-frame: what’s the recommended architecture for a game loop or timer?

Within the context of re-frame’s interceptor, coeffects / effects concepts I’m wondering what the recommended architectural approach is for events that are driven by a timer / cyclical event. In one of the github examples a clock is made by defining…
MFave
  • 1,044
  • 2
  • 8
  • 19
4
votes
1 answer

Getting error Uncaught Error: Assert failed: Reaction is read only; on-set is not allowed

I am new to clojure and reagent. I was trying to generate dynamic number of checkboxes, the state of which is stored in the app state which is a list of dicts like this [{:checked false, :text "Sample text 1"} {:checked false, :text "Sample text…
4
votes
1 answer

Clojurescript Semantic UI React Search custom renderer

I am trying to implement a search in Clojurescript with reagent/re-frame and semantic-ui. Semantic-ui uses a renderer for the suggestions. This renderer defaults to image, price, title, description. As I want to have suggestions on geocoding I want…
Timo
  • 320
  • 3
  • 14
4
votes
1 answer

Re-frame db organization

We have our Re-frame app db organized like this (simplified for this post): {:meta {:page/search {:page/component #'...} :page/details {:page/component #'...}} :widget/base {:cur-page-id :page/search} :page/search {:page/route {:query-params {:q…
Michiel Borkent
  • 34,228
  • 15
  • 86
  • 149
4
votes
2 answers

clojurescript/reagent for function doesn't work

Im recently using reagent and re-frame for my clojurescript project and i have a problem: So i have html custom tags And i want to swap them into my reagent-generated html using cljs for…
4
votes
2 answers

Nested components in re-frame not updating

I'm building a single-page app using re-frame. Each "page" of the app calls a component base-page then supplies its page-specific children... (defn base-page [& children] (into [:div ; banner goes here ] children)) (register-sub…
John Krasnay
  • 313
  • 2
  • 9
3
votes
3 answers

Reagent performance issue when passing atom as a function parameter

I work on the react-native application using Clojurescript re-frame and reagent. I have one text input component, and have two versions of the code: Version 1: input text is a separate component, and state atom is passed as an argument, the same as…
Marko
  • 30,263
  • 18
  • 74
  • 108
3
votes
2 answers

Full-Stack Clojure: How to get a Browser REPL and a Server REPL simultaneously during development

I'm developing my first full-stack Clojure application. I've managed to get the following working properly in Linux Mint: leiningen figwheel + garden[auto] = Interactive SPA development with hot code and CSS reloading leiningen REPL for Server with…
3
votes
1 answer

Animate antizer table with rc-animate in re-frame app

I am trying to recreate the example in http://react-component.github.io/table/examples/animation.html to add animation to a table in a re-frame app. The table is rendered using antizer which is a ClojureScript library for Ant Design react…
3
votes
3 answers

re-frame: reset atom after dispatch

I have this form: (defn input-question [] (let [new-question (reagent/atom "")] (fn [] [:div [:input {:type "text" :value @new-question :on-change #(reset! new-question (-> % .-target .-value))}] …
aarkerio
  • 2,183
  • 2
  • 20
  • 34
3
votes
1 answer

Trying to use re-frame-10x (was re-frame-trace) with descjop (electron) project

I'm trying to set up a project using a combination of re-frame and electron and I woud like to install re-frame-10x so I can easily watch certain parts of the app-db. I have used it before with a regular clojurescript/re-frame project accessed via…
Iain
  • 300
  • 2
  • 13
3
votes
1 answer

Disable RTL using ClojureScript, Re-natal and React-Native?

I'm develop an app in re-natal platform which is based on ClojureScript and React Native. I have an issue to disable RTL for my application in Android platform. this is the code to disable RTL in react-native which works totally fine: const…
petros
  • 791
  • 1
  • 6
  • 10
3
votes
1 answer

Re-run subscription on input change

I'm trying to create a re-frame subscription which reads data from a REST API instead of the local database and saves this data into the database. The REST call depends on other values in the re-frame database (think API-Key) and while this data is…
Sgoettschkes
  • 13,141
  • 5
  • 60
  • 78
3
votes
1 answer

Reagent doesn't rerender component with deref-ing inside of let

I have atom foo: (defonce foo (r/atom "foo")) I have parent component: (defn parent-component [] (js/setTimeout #(reset! foo "bar") 5000) (child-component {:foo foo})) And I have child component: (defn child-component [props] (let [derefed…
Boris Zagoruiko
  • 12,705
  • 15
  • 47
  • 79
3
votes
2 answers

Luminus and Re-Frame Uberjar Error

I've got a small app generated by lein new luminus +jetty +mongodb +re-frame +cider that errors when running the uberjar command. It works as a dev app run via lein repl. I've seen similar errors being put down to a dependency mismatch as…
Alex Lynham
  • 1,318
  • 2
  • 11
  • 29
1
2
3
9 10