How to use React Hook Form together with Fluent UI React (aka Office UI Fabric React)

Very often you need some fields in your SPFx web parts. Like text fields, dropdowns, checkboxes, etc. While you can manually perform form validation and form data collection, you can also use a helper library. React form libraries simplify a lot of things, however, they also require some time to learn the API and to adapt a library to your UI framework. 

React Hook Form (RHF) is one of such libraries. It's based solely on react hooks and gives a nicer way of managing and validating your forms, no matter which UI framework you use. In SPFx we mostly use Fluent UI React (formerly Office UI Fabric). In this post, I'm going to show how you can configure React Hook Form so that it plays nicely with Fluent UI. More...