Fork me on GitHub
#fulcro
<
2021-07-14
>
genekim01:07:37

I was going to DM @tony.kay to thank him for his help, but figured I should just post it here. For obvious reasons. Just a quick and public letter to @tony.kay and @wilkerlucio: after writing a toy app in Fulcro (and Pathom), I’m finding it to be a total revelation — I’ve spent tens of hours struggling for tens of hours to get my head around idents and queries, and all the other things required to write an app on my own… Earlier this year, I was able to write a Fulco RAD app to display reports from Datomic, which helped me solve a problem. But last week, I found myself unable to even replicate the first “click button to increment counter” in the Fulcro RAD template. Last Friday, I was able to get some pointers from Tony, and I showed him a toy RSS reader I was trying to build. And in the process, I had a whole bunch of lightbulb moments. Since then, I’m just stunned how quickly I’ve been able to get functionality built to that toy app . Since Friday talked, I’ve added: • two screens: show all stories (which Tony saw), and then since then, another to show search results • search screen required writing search resolver (thx @wilkerlucio), which included a simple form, that share some state with the “all stories” component, but mostly keep their own state — I know I’m terrible at forms and input, so even getting that done with so little fuss is amazing to me. • keyboard accelerators that run mutations for up/down/top/bottom story that works for both screens Now that I feel like I might be able to build meaningful things in Fulcro, I’ll start writing up my experiences, the major sticking points, the lightbulb moments, and the repo. But I wanted to share how delighted I am about the productivity that Fulcro / Pathom unlocks. (Given that y’all are already in this #fulcro channel, most of you probably don’t need to be convinced. But for those of you on the fence, there is something truly remarkable about Fulcro, once you understand its [what often feels like vast] surface area. But the magical-feeling upside: You never write web routes, you never marshal data back and forth, you feel like you’re writing one app (instead of two: CLJS front-end and CLJ backend), mutations only extend this marvelous illusion, and you’re marvelously insulated from all the maddening idiosyncrasies of JavaScript. Pathom lets you think about data retrievals to backend, instead of REST calls and for me, debugging why my REST calls hit the wrong routes. Thank you @tony.kay and @wilkerlucio for all the help! (And you, too, @holyjak!) PS: besides all the factors above, I think there’s another big reason that I’ve spent so much time trying to learn Fulcro — in his Clojure/conj 2017 talk, Rich Hickey describes in most programs, logic is dwarfed by information processing, but then at 21:34, he jokes, “unless it has a UI, then [logic + information processing] is just a dot [compared the vast vast vast amount of stuff required to show/control everything].” (everyone in audience laughs) Information processing is where all the irregularities are. [and UIs are where even more irregularities lurk. That’s always always stuck with me — and when @holyjak showed me how in Fulcro, when the data Is in the right shape, everything just magically seems to work. His Troubleshooting Guide shows how true that is. The last couple of days has shown me how Fulcro can remove so many of those idiosyncratic things that Rich talks about, and I’m finding it amazingly liberating. Knowing what I’ve learned, I suspect I could rewrite a complex Trello card management tool I use quite often in 5x less code (or maybe even 10x?), because so much code would disappear: ring/compojure, cljs-http calls and callbacks, imperfect (and maybe barely working) code that handles card deletion and the way I do optimistic deletion (and I know incorrect way of handling if Trello API card deletion fails). (Maybe it’s only 5x smaller code. It’s funny: I’d have to keep all those weird things you have to do in UIs: what happens if you select the next card, but it’s outside the viewport? you have to do all this weird stuff to figure out where to scrollToTop() and all that madness.) At any rate, here’s two screenshots of the two screens in the RSS viewer I built (it’s all the Clojure stories that I exported from Feedly): a main screen, and the search screen, and the screenshot of Rich Hickey gesturing as he jokes about UIs. 🙂 Hitting Enter now, because otherwise I could just keep going and going. 🙂

🙌 37
❤️ 25
fulcro 6
👍 2
pathom 2
genekim01:07:13

Link to Clojure/conj 2017 talk I referred to: https://youtu.be/2V1FtfBDsLU (I was there in the audience for that!)

raspasov02:07:59

Yes, I had that same revelation back in the om.next days!

raspasov02:07:22

Fulcro/Pathom has definitely more than expanded on that original vision.

🎉 4
genekim02:07:54

Before I forget — here would be my request from the Fulcro community: I feel that one of the biggest hurdles of learning Fulcro were the dearth of example programs. I’ll be publishing the toy RSS reader, but despite all the videos and tutorials that Tony has published, for me, it wasn’t enough to grok how to build things with it. As I posted before, I finally reached out to Tony when I couldn’t make the first simple example from the Fulcro book (“click me to increment”) work in the Fulcro RAD template. It showed the extent to which I did not understand how Fulcro actually worked, despite scores of hours of trying to write programs, watching videos, looking at sample repos. My request: if you’ve built Fulcro programs, can you publish portions of it? (And perhaps someone like @holyjak can catalog them.) I think this will help create the learning ladder to help others get the aha moment faster.

👍 10
🙌 2
donavan10:07:54

I completely agree with Gene Kim, I’ve honestly never had so much fun coding SPAs as I’m having now with Fulcro 😄 I also agree that there’s a jump in complexity from what’s publicly available and what I’ve been aiming for. I hope that, once we’ve found our feet, our team can contribute some public content focused on Fulcro.

❤️ 6
Chase15:07:40

Wow, what a glowing endorsement! I'm still in the completely overwhelmed phase (I'm still pretty new to web dev, period) so this is really motivating as I keep grinding away. Thank you for sharing

adamfeldman15:07:35

Thank you for sharing your experience @U6VPZS1EK! This story and your https://itrevolution.com/love-letter-to-clojure-part-1/ are very very powerful 🙂. I too discovered and came to love Fulcro via the same mechanism: I knew there had to be better ways of writing data-driven web UIs (B2B and otherwise). Toying with https://marmelab.com/react-admin/ + https://github.com/hasura/ra-data-hasura circa 2018 directly led me to seek out Fulcro (the internal machinery in react-admin was scary in context of JS churn…)

lgessler18:07:32

Might point to this message next time I'm trying to sell Fulcro to someone 🙂 @U6VPZS1EK you eloquently describe what I also think is one of the most differentiating and productive features of Fulcro, which is that it quite leaklessly abstracts away server-client transport and uses Pathom to save you from the drudgery of writing a typical REST API.

❤️ 2
lgessler18:07:08

Also 100% agree with what you said re: full programs being publicly available, @U6VPZS1EK. I leaned heavily on the fulcro template and @U051V5LLP's template when I was first learning Fulcro back in 2019, but there were still some hard problems I couldn't look to any examples for. I'm actively developing a linguistic annotation app (roughly, that's the process of creating supervised training datasets for NLP) and while it's still not complete and certainly not as high-quality as code a lot of the people in this channel would write, looking at it might be useful for beginners: https://github.com/lgessler/glam This might be a good time to ask: are there any "real" fulcro apps out there that are open source? I still don't know of any that are beyond toy-sized, except Gene's RSS reader of course, which I'm eager to see

👍 2
genekim19:07:48

@U49U72C4V That is uncanny — I was studying glam last night, trying to figure how to store state like you do with :root/drawer-open? , as I was having a problem like you described here last July! https://clojurians-log.clojureverse.org/fulcro/2020-07-09

🙌 2
genekim19:07:42

Hey, would anyone be willing to spend an hour with me sometime this week to help me publish this repo, confirm it works on your system, walk thru the various screens/tutorials, make sure they make sense, etc? (And maybe help answer another Fulcro mystery I’m trying to solve, while we’re at it? 🙂 🙏

Jakub Holý (HolyJak)20:07:32

@U49U72C4V @U6VPZS1EK could y send a PR to https://github.com/fulcro-community/awesome-fulcro adding a section for "Open-source Fulcro applications" linking to your respective apps? 🙏 @U6VPZS1EK if you still need help next week then I can

👍 5
lgessler20:07:33

@U6VPZS1EK this week is stuffed for me but ping me next week if you still need a hand 🙂

🎉 4
👍 4