RokLenarcic / awesome-fulcro

A curated list of awesome resources for Fulcro

Awesome Fulcro

A curated list of awesome resources for Fulcro and Fulcro RAD, the most awesome (web)app framework the Earth has ever seen.

Motivation

• 🎬 Why Build Solutions with Fulcro - Tom Toor (video, 2019)

• Want more from your frontend framework! Re-thinking web dev experience - “I will compare Redux + REST with a full-stack, component-centric solution based on a graph API (think GraphQL) that I came to love.”

Learning

Recommended community resources

Check out Jakub’s self-paced workshop Introduction to creating webapps with Fulcro to get familiar with the concepts and the amazing tooling before deep-diving into learning the details. Then continue with the Minimalist Fulcro Tutorial and its exercises. For more, see the Guide to learning Fulcro and all the other fulcro-community resources.

Official and semi-official documentation

• Fulcro Developers Guide

• 🎬 Fulcro 3 tutorials (video) indispensable!

  • Alex Eeberts Fulcro Video Notes provide a detailed table of contents for the videos, with links to the corresponding sections

• 🎬 All Tony Kay’s videos

  • 🎬 Grokking Fulcro series - The intended audience of this video series is anyone with a basic understanding of Javascript and Clojurescript that wishes to know more about how Fulcro works. I do not assume a ton of prior knowledge about Fulcro itself, yet I think even most seasoned Fulcro developers will learn something from every video. Focus: Explain the lower-level details of React and Fulcro in the context of Clojurescript. Help developers gain an understanding of the core APIs of Fulcro. Cover the approaches to designing common things in Fulcro so you can apply those patterns in your own applications. Reveal some of the superpowers of Clojurescript for people that do not know it well.

• Fulcro RAD Developer’s Guide

• Pathom v2

• 2020 podcast series on Fulcro and Pathom is also a very valuable resource, full of insights and valuable reasoning

  • S4 E6 - Fulcro with Tony Kay (Part 1)

  • S4 E7 - Fulcro with Tony Kay (Part 2)

  • S4 E8 - Fulcro with Tony Kay (Part 3)

  • S4 E9 - Fulcro with Tony Kay (Part 4)

  • S4 E10 - Fulcro with Tony Kay (Part 5)

  • S4 E15 Pathom with Wilker Lúcio (Part 1)

  • S4 E16 Pathom with Wilker Lúcio (Part 2)

Tutorials

• https://awkay.github.io/om-tutorial/#!/om_tutorial.D_Queries - this older OMNext / Eql tutorial is reportedly useful for understanding query syntax

• Chris O’Donnell’s Gift list dev diary series (2020) - building a non-trivial Fulcro app from scratch, step by step

  1. introduction

  2. authentication

  3. routing

  4. initial backend

  5. backend persistence

  6. parser tests

  7. API auth

  8. form and listing

  9. navigation

  10. deployment

• Fulcro via Re-frame — makes a couple of comparisons to re-frame and proceeds to the Fulcro basics: defsc, queries, idents, normalization, mutations, and targeting.

Snippets and demos

• Jean Boudet, 2022: Demonstration of integrating a Fulcro app into React Native without Expo, leveraging the native-or-web library react-native-web. Featuring Fulcro’s multiple-roots-renderer and React Native’s AppRegistry.registerComponent.

Troubleshooting

• Fulcro Troubleshooting Decision Tree - A decision tree to help you go from a problem to the most appropriate troubleshooting steps

• 🎬 Learning Fulcro - troubleshooting demos (by Jakub Holý) - a series of short screencasts demonstrating how to troubleshoot various problems in a Fulcro app

Other

• EQL Style Guide - Some tips about how to model, name, and organize your domain and your data.

• Fulcro Explained: When UI Components and Data Entities Diverge - “Fulcro’s stateful components serve normally both as elements of the UI and to define the data model, i.e. data entities with their unique IDs and attributes. But what if your UI and data model needs diverge? We will take a look at what different kinds of divergence between the UI and data entities you might encounter and how to solve them.”

• Error handling in Fulcro: 3 approaches

• 🎬 Fulcro notes on Tony Kay video series

• An example of data and UI modeling - from a graphical sketch of a UI through the analysis to a draft UI, with the thinking process documented

Templates and Examples

Templates

• The official fulcro-template and fulcro-rad-demo

• https://github.com/dvingo/dv.fulcro-template - based on the fulcro3 template but differs in backend tech and will continue to diverge as features are added to this template.

• minimalist-fulcro-template-backendless - A template for starting a new, frontend-only Fulcro application with in-browser Pathom. Intended for playing with and learning Fulcro, not for production apps, and therefore simpler than the official fulcro-template.

Examples / experiments

• Fulcro Todo MVC - an implementation of todomvc.com in Fulcro, by Tony

• Dvingo’s pathom-client-wikipedia - example client-only fulcro app hitting a rest api

• PoC of a GUI and a teminal UI built with Fulcro and Membrane

• rss-reader-fulcro-demo (2021) by Gene Kim is a RAD-based app "that lets you read past articles from the Planet Clojure RSS feed" - featuring integrating keybord shortcuts (via Mousetrap)

"Real" Apps

• Glam - a linguistic annotation app that uses Fulcro, Pathom, Material-UI, and Crux. (Work in progress.)

• fulcro-billing-app - A somewhat simplified and anonymized fork of a production app made with Fulcro and Fulcro RAD in 2020 - 2021

• Decide (since 2019) - "Better decision-making in large groups"

Tools and libraries

• fulcro-troubleshooting - A development-time library for Fulcro that helps to detect problems earlier and find and fix their root cause faster

• Subscriptions extracts re-frame’s subscriptions and generalizes them over the data store and is usable with Fulcro - here is demo of Subscriptions with Fulcro