React

React is a popular front-end rendering library. Thanks to their shared foucs on modularity and composability, React and Variant pair incredibly well together. React conditional rendering may be controlled by variant match functions. Variants may be used for internal logic or dynamically fetched data, serving well as serializable types (which can be kept in the app state) that can still be inspected at runtime.

React is often paired with Redux, MobX, or other state management systems to manage information at an application-scale.

State machines

Init -> Loading (Percentage) -> App state

Form validation

• Useful to present multiple types of error messages to the user.
• Can express degrees of failure
  • Success <data>
  • Warning <messages>
  • Failure <errors>

Conditional rendering

• Add example of match() inside of a render function.

Tabs

• Create a list of tabs, including a details tab