Building forms using React

Creating a Form — Controlled Component vs. Uncontrolled Component

• The form’s structure is similar to those of the usual HTML forms. However, each input element gets a component of its own, which we call dumb components. The container component is responsible for maintaining the state. The difference is, we're using a callback function to handle form events and then using the container’s state to store the form data. This gives your component better control over the form control elements and the form data.

Structuring a Form

• React's composition model lets you organize your React components into smaller reusable code. Each component exists as an independent functional unit and an hierarchy of components can be used to represent a specific feature. This structure works particularly well with forms.

Dumb Components

• Input
• Select
• Checkbox
• Textarea
• Button
• For instructions on all ofthe above, click the source link below.

Source: https://www.codementor.io/blizzerand/building-forms-using-react-everything-you-need-to-know-iz3eyoq4y