This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-10-10
Channels
- # 100-days-of-code (2)
- # announcements (2)
- # aws (11)
- # beginners (114)
- # boot (6)
- # calva (11)
- # cider (11)
- # cljdoc (2)
- # cljs-dev (7)
- # clojure (126)
- # clojure-berlin (1)
- # clojure-conj (4)
- # clojure-dev (1)
- # clojure-germany (12)
- # clojure-italy (22)
- # clojure-spec (96)
- # clojure-uk (111)
- # clojurescript (27)
- # core-async (8)
- # cursive (17)
- # datomic (26)
- # devops (5)
- # editors (15)
- # emacs (13)
- # events (1)
- # figwheel-main (27)
- # fulcro (64)
- # hyperfiddle (29)
- # jobs (8)
- # jobs-discuss (7)
- # liberator (4)
- # off-topic (46)
- # om (9)
- # onyx (1)
- # overtone (1)
- # perun (8)
- # re-frame (28)
- # reagent (35)
- # reitit (5)
- # shadow-cljs (96)
- # spacemacs (1)
- # testing (10)
- # timbre (8)
- # tools-deps (63)
- # unrepl (1)
- # yada (10)
Hello, I have never used Reagent and am trying to find out whether it is easy enough to build a basic web app which would have a few buttons, and little state. Specifically, I want to know whether it is easy to write repeatable data: the data items would be shown in html tables; and also, draw onto canvases and interact with graphic libs such as d3.js…Would I need to also learn Re-Frame to do the above? thanks for any comment!
@kingcode you can do all of those things with reagent. keep in mind reagent adds a layer of abstraction on top of react in addition to its state management techniques. re-frame adds considerably more structure to reagent’s built-in state management. so, yes you can do what you are asking. no you don’t need re-frame
@lee.justin.m Thank you..yes indeed I am aware of React, and have figwheel installed and running with Cider. I am trying to decide which will be faster - om or reagent/re-frame.
if you are already familiar with react, reagent is probably the least amount of stuff you need to learn
well that’ll help. just run through the docs directory on github and you should be up and running pretty quickly
I remember I had a question with regards to the need to use the exact same variable names within component declarations in Reagent when returning a function
@kingcode if you're familiar with just the concept of react lifecycle (will mount, render did mount) should be good to go for quite a while. Not much else from react is needed for 95 percent of stuff
I will check it out and come back with my question later - thank you @gadfly361 as well
@kingcode if you are interested in d3, I'd recommend this library I made: https://github.com/gadfly361/rid3
@gadfly361 Thanks, will check it out….I need to build bar charts and plot point graphs - will that be possible?
I’ve had good times making simple declarative charts with http://recharts.org/
(defn my-bar-chart []
(let [data [{:a "cats" :b 200} {:a "dogs" :b 300}]]
[:> rc/ResponsiveContainer {:width "100%" :height 300}
[:> rc/BarChart {:data data}
[:> rc/CartesianGrid]
[:> rc/Legend]
[:> rc/Tooltip]
[:> rc/YAxis]
[:> rc/XAxis {:dataKey :a}]
[:> rc/Bar {:dataKey :b :label false :fill "#ffd400"}]]]))
Available in cljsjs [cljsjs/recharts "1.1.0-3"]
form-2
is not rendering. I made a simple test button, then changed it over to form-2 and nothing happens. I checked the code and found mount-components does call reagent/render.
(defn counting-button [txt]
(let [state (r/atom 0)] ;; state is accessible in the render function
(fn [txt]
[:button.green
{:on-click #(swap! state inc)}
(str txt " " @state)])))
That should work, the error must be elsewhere in the code @llsouder
something is wrong. I just commented out almost everything and I still see println I commented out in my figwheel repl. Other things are changing but I don't see my new println.
maybe cljs didn't build? the function looks fine
Try Shift-Reload, restarting the dev env, and cleaning build artifacts (roughly in that order)
I deleted target/cljs, (clean-builds) in fig, and shift-reload And finally got rid of yesterday's debug prints
but still no form-2 components. I put a println of the txt
in the counting-button, before the let
and now I see that print but no counting button
There's no println in the snippet you posted. How do you expect us to be able to guess what problem you're talking about? It helps if you boil it down to a minimum and post the full namespace e.g. as a gist.
I was calling my components in a list not a vector so () evaluated my function and [] does not. [] appears to work. still... waiting for run/fig to come up...