#topic
What are Controlled Components
Forms are an essential part of most websites and applications. They allow users to interact with your application and provide valuable information. In React, there are two types of form components: controlled and uncontrolled.
Controlled components vs. Uncontrolled components
In most cases, React recommends using controlled components to implement forms. While this approach aligns with the React declarative model, uncontrolled form fields are still a valid option and have their merit. Let's break them down to see the differences between the two approaches and when you should use each method.
Creating a Form component
Forms may look simple, but there are many different features and functionality to forms. For developers, there is an art to constructing forms. React makes constructing and customizing forms much easier for developers, and that's why it's such a popular choice.
Controlled components in React are those in which form data is handled by the component's state. Whereas uncontrolled components are those in which the form data is handled by the DOM itself.
Creating a Controled Form Component
In this excerpt from the React course, we will learn how to create a feedback form using controlled components and custom validation. The example we will use is a feedback form similar to what you might have encountered after purchasing a product online or booking a table at a restaurant.
Exercise Create a registration form_
You've learned how to create controlled components and forms in React. Now it's time to put that knowledge to use and create a registration form for Little Lemon Restaurant, where users are able to sign up.