Fork me on GitHub
#fulcro
<
2018-04-19
>
parameme00:04:18

Hi all, from a marketing perspective - would there be much to gain for fulcro to submit an app to this? https://medium.freecodecamp.org/a-real-world-comparison-of-front-end-frameworks-with-benchmarks-2018-update-e5760fb4a962

parameme00:04:42

(I note fulcro would potentially have an even better story to tell regarding serverside, CSS and the inspector).

myguidingstar01:04:58

yeah, fulcro will definitely shine there

myguidingstar01:04:45

with the upcoming version of walkable, realworld's server side can be done easily

myguidingstar01:04:39

we can implement client only with their REST spec, but I suggest a fullstack app

liesbeth08:04:51

Yes I think fulcro would indeed do best with a fullstack app! But it seems that the boundaries set by this challenge is that any frontend should be able to communicate with any backend.

myguidingstar09:04:12

I think it's not the case. For instance a frontend app that expect a REST api won't work with a graphql api implementation

liesbeth09:04:01

You are right. I think the original idea was to all use the same REST api as the headline says ‘See how the exact same http://Medium.com clone (called Conduit) is built using any of our supported frontends and backends. Yes, you can mix and match them, because they all adhere to the same API spec 😮😎‘’, But I see now that they also have a fullstack category 😄 https://github.com/gothinkster/realworld#fullstack . I’d be interested to help out!

myguidingstar11:04:14

oh that's is great! I have a REST version here built with Walkable. Most of the dev time was spent on routing! Converting to fulcro server should be trivial https://github.com/walkable-server/realworld

myguidingstar01:04:01

please create the client side app, I will take care of the server side

parameme05:04:45

Who was this directed to?

myguidingstar15:04:42

it was to you. However, other people seem to be not interested in this? 😮

myguidingstar15:04:13

would you like to make that app? @U0JTK6WS2

parameme16:04:25

I would love to but unfortunately I currently lack the necessary skills, confidence and time. (My day job is rails / SQL and I am dabbling with Clojure[script] only as a side project). Apologies for getting anyone’s hopes up - I was hoping to arouse enthusiasm from the more knowledgeable crowd (who also are time squeezed but would be 100x as productive) because I thought it would be a great showcase for fulcro’s advantages.

myguidingstar16:04:38

no worries, it took me quite some time to understand fulcro. Don't rush, take small steps and we will get there. People here are eager to help 🙂

levitanong04:04:11

hi @tony.kay and @thheller, trying to run shadow-cljs release main with :infer-externs :auto. I’m getting a lot of warnings about shadow not being able to infer fulcro stuff. Is this expected behavior, and if not, is there something that can be done about this?

thheller07:04:24

@levitanong do you have fulcro sources in your project? :auto will only warn for actual files you have in your classpath (not files in jars).

levitanong08:04:18

@thheller not at all. The warnings seem to be all about the lifecycle stuff in fulcro: Cannot infer target type in expression (. this__27552__auto__ initLocalState)

levitanong08:04:28

Cannot infer target type in expression (. (. Sidebar fulcro.client.primitives/-prototype) fulcro.client.primitives/-fulcro$isComponent)

levitanong08:04:32

also, another funny thing:

------ WARNING #1 --------------------------------------------------------------
 File: ~/.m2/repository/org/clojure/clojurescript/1.10.238/clojurescript-1.10.238.jar!/cljs/core.cljs:11505:17
--------------------------------------------------------------------------------
11502 |     (enable-console-print!)
11503 | 
11504 |     (identical? *target* "nashorn")
11505 |     (let [system (.type js/Java "java.lang.System")]
-----------------------^--------------------------------------------------------
 variable Java is undeclared
--------------------------------------------------------------------------------
11506 |       (set! *print-newline* false)
11507 |       (set-print-fn!
11508 |         (fn []
11509 |           (let [xs (js-arguments)
--------------------------------------------------------------------------------

thheller08:04:46

ah macro stuff. hmm yeah thats gonna confuse the externs inference

thheller08:04:11

yeah I fixed that in master

levitanong08:04:29

yay! so the fulcro thing, is it even possible to fix this?

thheller08:04:06

only on fulcro's side. it would need to generate code with typehints in a few cases

thheller08:04:10

or use special dispatch functions instead of dot interop

levitanong08:04:12

I see, I guess we’ll have to see if this is something @tony.kay wants to do 😛

levitanong08:04:01

by the way, really loving your release-snapshot. I’m thinking about making a visualizer for this.

thheller08:04:16

@steveb8n wants to write a tree-map visualization for that as well. @alex-dixon also expressed interest in building something. https://github.com/thheller/shadow-cljs/issues/247

levitanong08:04:31

oh great! i don’t have to build anything then! 😄

thheller08:04:56

hehe maybe talk to them if you have ideas but yeah there might be stuff coming soon already 🙂

steveb8n08:04:19

I'll get it started and will welcome contributions 😀

levitanong08:04:58

👌 @steveb8n please link me the repo when you have something, and I can just take a look at your issue list to see what needs doing. 😄

steveb8n08:04:35

Perfect. I should have something up after this weekend

👍 4
Chris Rosengren10:04:43

Anyone integrate Material UI with fulcro? I have it mostly working but my text fields lose focus when I set-string! them,

claudiu15:04:21

has anybody tried getting SSR to work with Dynamic Queries ? 🙂

tony.kay15:04:35

@claudiu SSR and dynamic queries: should work perfectly..just need to remember to pass state (with the updated queries) to get-query at the root

tony.kay15:04:21

@levitanong glad to add type hints…would appreciate help. Kind of busy these days

tony.kay15:04:58

@christopher.rosengren You just using CSS, or some js-y things?

claudiu15:04:11

@tony.kay Most be missing something. I added the state exactly as the frontend state (frontend works with just initial state from html). But on server it does not render my page component 😞 Behaves the same as if on the client I comment out (defmethod r/get-dynamic-router-target :main [k] Main)

tony.kay15:04:43

The front-end passes state to root’s get-query behind the scenes

tony.kay15:04:12

your server has to do the same…call set-query* on your server built state, then pass that updated state to get-query.

tony.kay15:04:28

dynamic queries are completely state dependent

tony.kay15:04:00

or do you not actually mean dynamic queries?

tony.kay15:04:07

perhaps you mean routing and unions?

tony.kay15:04:29

nvm…I see in your code you’re using the dynamic router

tony.kay15:04:32

so obviously 🙂

tony.kay15:04:24

You are making sure that your server code requires all of the dynamic modules you’re trying to render from?

tony.kay15:04:33

they “register” themselves with the defmethod

tony.kay15:04:41

so if it does not get required, it won’t work

claudiu15:04:23

I imported the router and the ui.root (where I have 3 components like in dynamicUiRouting from the book)

tony.kay15:04:15

you also have to (on the server only) require any screens that will be rendered

tony.kay15:04:58

otherwise it cannot reach them because they are not registered…the client dynamic router code loads them, which registers them. On the server, you have to load them

claudiu15:04:13

Does the server also add metadata in the state ? I'm building the state a bit strangely... a bit of copy paste from fulcro-inspect

claudiu15:04:26

normalized-state (cond-> base-state
                                 true (r/add-route-state :main root/Main)
                                 true (prim/set-query* (prim/factory root/Main) {:query (prim/get-query root/Main)})
                                 true (assoc-in
                                        [:fulcro.client.routing.routers/by-id :top-router :fulcro.client.routing/current-route]
                                        [:main :singleton])
                                 true (#(prim/set-query*
                                          %
                                          (prim/factory r/DynamicRouter {:qualifier :top-router})
                                          {:query [
                                                   :fulcro.client.routing/id
                                                   :fulcro.client.routing/dynamic
                                                   {:fulcro.client.routing/current-route
                                                    "project.ui.root/Main"}]}))

tony.kay16:04:49

@claudiu so, the client and server code are cljc for most of this…it is the same code

tony.kay16:04:04

instead of using things like assoc-in, I think there are helpers in router namespace for setting the route

tony.kay16:04:35

and route-to-impl!

tony.kay16:04:16

the latter is best for dynamic routing

claudiu16:04:29

seems to work. I am doing something wrong when generating the app-state on the server I get current-route: [:main :singleton] instead of the query 🙂

claudiu16:04:02

but does rote-to-impl! work on server ? seems to require a reconciler and in the docs says I should work set-query* to workaround

tony.kay16:04:12

oh…hold on

tony.kay16:04:08

no, it doesn’t 😕

tony.kay16:04:21

I’m not sure dynamic queries have been used against SSR yet

tony.kay16:04:04

your code is really hard to read, because you put it in a thread…and it is wrapping like crazy

claudiu16:04:20

Yep, sry. Got it working a bit by sending what the client sends to top-router while we were talking

claudiu16:04:58

(cond-> base-state
                                 true (r/add-route-state :main Main)
                                 true (prim/set-query* (prim/factory Main) {:query (prim/get-query Main)})
                                 true (assoc-in
                                        [:fulcro.client.routing.routers/by-id :top-router :fulcro.client.routing/current-route]
                                        [:main :singleton])

                                 true (#(prim/set-query*
                                          %
                                          (prim/factory r/DynamicRouter {:qualifier :top-router})
                                          {:query [
                                                   :fulcro.client.routing/id
                                                   :fulcro.client.routing/dynamic
                                                   {:fulcro.client.routing/current-route
                                                    "project.ui.root/Main"}]})))

claudiu16:04:28

Could not really figure out if there's a easy way to set the dynamic-query for the router after I add the current-route ident 😞

tony.kay16:04:24

why are you using cond-> when all of the branches are true ?

tony.kay16:04:22

anyway…you got it working?

claudiu16:04:22

ahh 🙂 also have if loggedin and a few other there, that I removed from the copy/paste. Like in https://github.com/fulcrologic/fulcro-template/blob/master/src/main/fulcro_template/server.clj#L102

tony.kay16:04:43

I see, figured after I wrote that

claudiu16:04:34

Yep. But by pasting the query directly into the state. Now just have to figure out how to generate that state 🙂

claudiu16:04:15

After I add the current route, is there a method that I missed that generates this in app state

:fulcro.client.primitives/queries ▶ {"fulcro.client.routing/DynamicRouter$:top-router
` ?

tony.kay16:04:39

queries are stored (normalized) into the db by their class name and qualifier

tony.kay16:04:51

just like any other things

tony.kay16:04:13

set-query is kinda like tree->db, but for queries

exit216:04:27

I’m trying to find what replaces from-history

exit216:04:53

after the rename script, fulcro.client.primitives/from-history

exit216:04:09

I’m guessing this was some om.next before

tony.kay16:04:45

@njj history went through a complete rewrite. It has not been heavily used, but it is no longer indexed quite the same. Don’t remember off the top of my head.

exit216:04:14

I tried looking for from-history in the repo, no luck as of yet

tony.kay16:04:38

see this history.cljc namespace

tony.kay16:04:55

there is a history navigator, and also look at support viewer code

tony.kay16:04:10

the support viewer was updated, so that should be a reasonable example

tony.kay16:04:58

prim/get-history is what you want for getting this current history, then make a history navigator

tony.kay16:04:05

(or just use it directly)

tony.kay16:04:13

line 37 of support viewer is how you’d reset your state based on history

tony.kay16:04:27

Fulcro Inspec also has history nav built in…slider in the db tab

exit216:04:17

ok thanks

Jacob16:04:07

Hello! simple_smile, I’m starting to learn about Fulcro and Fulcro SQL so I hope this question makes sense. It is clear to me from the documentation how to integrate with a Fulcro server and how reads and mutations receive the DB manager. I have an external method (so no read nor mutation) in my app that has to do some insertions in the DB. I thought that it would be cool to use the DB Manager registered with the server so I don’t have to worry about configuration, for example. Is there any way to get an instance of my DB Manager in my function?. I was thinking

(defn myfn []
	(let [dbs (some-way-to-get-it)] ; This db manager would already be reading from the right environment, etc.
		 (let [dbspec (fulcro-sql.core/get-dbspec dbs :mydb)]
		      (jdbc/insert! dbspec ...))))
I mean, does the idea make sense?

exit216:04:39

@tony.kay ha, turns out the function that uses from-history isn’t used anywhere. So no worries for now 😄

tony.kay16:04:04

@jacob.mendoza your code needs to run in the same process, right? So, your function needs to be called from a component of the server. Therefore: inject the db manager into that component, and then pass it to that function.

tony.kay16:04:25

your only other option is to access the atom holding your system, and pull it out of there once the system is started

tony.kay17:04:14

You could add a simple component whose “start” method calls your function if this is startup code, etc.

tony.kay17:04:26

You can also use Flyway to pre-populate things

tony.kay17:04:33

(which is part of the migrations)

Jacob17:04:50

> So, your function needs to be called from a component of the server. Therefore: inject the db manager into that component, and then pass it to that function. Oh, that really seems like the way to go. Still discovering things, I haven’t thought about that before. Thank you so much @tony.kay, let’s try to see if I can make it work!.

tony.kay17:04:47

it’s just component/using for injection, and a defrecord that implements lifecycle 🙂

Jacob17:04:03

That’s true! Thank you!

exit218:04:07

@tony.kay I found that load-data was moved to load, when renaming I seem to be running into some issues. (df/load reconciler [:web-env :env-vars :login-profile] :marker false)

exit218:04:16

I’m assuming I need to rework this in general

tony.kay18:04:28

oh…hm. Load options go in a map

exit218:04:36

yeah I noticed that

tony.kay18:04:39

but I think when we ported it we made it tolerate the old style…

exit218:04:06

it got mad about that, Uncaught Error: false is not ISeqable

exit218:04:26

but when putting it in a map, a new error arises Uncaught Error: Assert failed: (or (util/ident? server-property-or-ident) (keyword? server-property-or-ident))

tony.kay18:04:32

nope…sorry bout that. I thought we had kept the sig

tony.kay18:04:49

OH…you mean the really old load-data

tony.kay18:04:00

yeah, that was deprecated a long time ago

tony.kay18:04:06

even in Untangled I think…was removed

exit218:04:58

which has started me down this path

tony.kay18:04:01

So, your specific example should now be written as 3 loads, or using the internal mutation if you must have a custom query

tony.kay18:04:22

(load app :web-env nil {:marker false})

tony.kay18:04:31

they will be combined internally into one net request

exit218:04:05

I’ll give that a shot

exit218:04:17

I was able to at least get the main page to load, now some exhaustive testing haha

pat18:04:30

I'm seeing (reconciler? reconciler) fail with latest release, cljs 1.10. is this known issue? There was a similar problem with om, I think it had to do with new map-entries

tony.kay20:04:39

@pat Not aware of the problem…just a sec

tony.kay20:04:36

I’m using cljs 1.10 + Fulcro 2.5

tony.kay20:04:21

(js/console.log :r? (prim/reconciler? (-> this prim/get-reconciler))) inside of a component shows “:r? true” in the console

pat20:04:20

is it possible its clashing with om in the same runtime (my editor is in om)?

pat20:04:35

cant get simplest thing to work

tony.kay21:04:42

@pat, definitely don’t want Om and FUlcro in at the same time w/2.0+

fiddlerwoaroof22:04:23

Is there an easy-ish way to use react components from an arbitrary npm package?

claudiu23:04:05

@tony.kay Still no luck with generating the dynamic query correct state on server to get it working. 😞 Tried to get a simple non-working example here https://gist.github.com/claudiu-apetrei/f22000f7721b6f7b56f5f89797cbc083

claudiu23:04:39

probably missing something really basic about how dynamic queries fit together.

liesbeth09:04:01

You are right. I think the original idea was to all use the same REST api as the headline says ‘See how the exact same http://Medium.com clone (called Conduit) is built using any of our supported frontends and backends. Yes, you can mix and match them, because they all adhere to the same API spec 😮😎‘’, But I see now that they also have a fullstack category 😄 https://github.com/gothinkster/realworld#fullstack . I’d be interested to help out!

myguidingstar11:04:14

oh that's is great! I have a REST version here built with Walkable. Most of the dev time was spent on routing! Converting to fulcro server should be trivial https://github.com/walkable-server/realworld