Let's get started ...
There are many concepts and patterns like Render Props and Component Composition out there. Some smaller practices would be deriving state and computed properties.
However, there are only a few popular ones and I am often missing people shouting out their novel approaches!
Here is my list of some useful approaches for certain situations ...
useState/useReducer Middleware
Using useReducer over useState helps tremendously when dealing with complex state. However, both state management are missing a callback function which happen before or after the state transition:
Context Injection
When using React Context, the default is having one top-level Provider component with a stateful value (tutorial). For one of my use cases, I found the opposite useful: multiple top-level Providers + stateless value.
Mediator Components
A React application consists of domain specific components (e.g. MessagePage) and reusable components (e.g. List). Usually the latter is used within the former. However, to keep things clean, it's a good practice to introduce mediator components (e.g. MessageList) which are bridging the domain layer to the functional layer.
What are your infamous concepts, patterns, and practices that you are using in your React projects? I would like to hear about these :-) That's it from my side for this month!
Pick of the Month
With all the blockchain hype this year, I got interested about what kind of literature is out there about people in this space. When I came across The Infinite Machine, I was hooked and listened to it in one fell swoop! It's about the founders of Ethereum and their journey from idea to launch.