React Hook Form Controlled Components 1: The process & MUI Checkbox

In this first video of the mini series about controlled components we talk about the simple process of integrating virtually any controlled react component with React Hook Form.

We also see what the end result will look like after we're done with the controlled components integration series of videos.

We start off with a simple NextJS project that has MUI installed already and integrate the Checkbox Component.

👩‍💻 Github Links:

📔 Chapters:

00:00 Intro
00:41 Project Overview
02:05 Controlled Components
04:28 Step 1: Controlled Properties & API
07:13 Step 2: Component in Isolation
12:43 Step 3: RHF Controller Integration
21:23 Step 4: External Value Handling
29:10 Uncontrolled to Controlled
30:27 Recap & Outro

[fares.abuali]

Thank you so much!
Concise & informative 🎉

[vladgrecu]

Really awesome content Vladut, keep em' comming

[OnlyJavascript]

the best. Thanks man!! Looking forward to next section.

[jexsie]

Subscribed, I really need more about react hook form. Thanks a lot

[bluebill]

Another great video with excellent explanation. <3

[pogadev]

Very nice explanation, you make it look easy! Looking forward for the next videos in the series

[raymondcaddick]

I'm getting infinite loading when trying to add this to a form

[ibrahimabdallah]

Great video. However, I can argue that the demonstration of useMemo is useless in this case