Forms are a standard way of seeking user input. In this lesson, we will explore control forms. A way of setting up forms in your React Application whereby your form information is directly tied into the state of your React component that is hosting the form. So, any changes that you make to your form imports will be immediately reflected into the state of your React component and so, the state of the form, or the information that the form is always reflected in that state of the React component can't be retrieved from there. Similarly, you can also do form validation to ensure that the information being submitted is within reasonable limits. So we'll do the client site form validation in this lesson. Let's learn a little more about control forms. As I mentioned, forms are a very standard approach for users to input data for your application. So it provides a cohesive and effective, and a compelling way of inputting data into your application. And so, as we see HTML supports forms in various ways, forms are extensively used on many websites. When you log into any website for example, typically they will pop up a form for you where you fill in your username and password to log into their website. Maybe you're submitting some information to your website, maybe you are submitting a feedback to a place, maybe you're reserving a table at a restaurant. All these can be easily supported through the use of forms. Support for forms is already built-in to HTML. So as you realize, in HTML, you can easily create a form wherever you want in your html page by using the form tag. And inside the form tag, you will include various form elements. The input form element allows us to create the input boxes in the form where you can fill in information. The input type could be of the type text, password, submit, radio button, checkbox, email, telephone number, date and time, and many more. Similarly, you have text area which will give you a number of rows, within a box allowing you to type in a long message. You have buttons which allow you to submit the forms, and then you have select, which gives you options from which you can select one of the options. So, how do these form elements from HTML forms? How do they interact with your React Application or in other words, how does your React Application get input from the forms and then make use of it? Before we understand that part, they have to realize that, every one of these form elements in HTML maintain their own state within DOM. And then they will update it based on user input. So in a text box for example, if you're typing value, that input value that you type in will be retained in the DOM by that input box. Now, we want to be able to connect that into our React components state, so that any changes to a box will be immediately reflected into React component state. Similarly, from the state, we can set the initial value for any of these form elements. So, how do we do this? This is where the user control components in React come to aid. So, what is a Controlled Component? Controlled component makes the React component itself control the form that it renders. So when you include the form into the view of a React component, then you can easily tie in the React component state to the form, so that it will become the single source of truth. So the form information, whatever is the state of form will reflected into the state of the React component, so the form state and the components state will be match with each other. And this kind of implementation is what is referred to as a control component in React. Now, with the control component, every state mutation, anytime you change any of the state, it will have to be reflected into the state of your React component. So you need appropriate handler functions that will enable change. So for example, if there is any change in a box, then that change should be immediately reflective to the state of your React component. Similarly, when the user clicks on the submit button, the submitted value should be captured inside your React component and thereafter can be processed as required by your React Application. So all this requires implementation of handler functions. So how do we achieve all of this? Now, this is what we will explore with an example in the exercise that follows this lecture. You will see how we can tie in the form state to the state of the component to create a controlled form, and then be able to take the inputs and then modify the state as the form state has been changed. Modify the state of the React Application, and similarly, handle the submission of the forms. Also in the second exercise, we will do some form validation.