Skip to content

Commit 34e4ef9

Browse files
committed
day 22 has been added
1 parent 7781cd5 commit 34e4ef9

18 files changed

+14477
-8
lines changed

12_Day_Forms/12_forms.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ Now, you know most of the fields we need to get data from a form. Let's start wi
8686

8787
## Getting data from an input field
8888

89-
So far we did not get any data from input field. Now, it is time to learn how to get data from an input field. We need on input field, event listener (onChange) and state to get data from a controlled input. See the example below. The h1 element below the input tag display what we write on the input. Check live [demo](https://codepen.io/Asabeneh/full/OJVpyqm).
89+
So far we did not get any data from input field. Now, it is time to learn how to get data from an input field. We need an input field, event listener (onChange) and state to get data from a controlled input. See the example below. The h1 element below the input tag display what we write on the input. Check live [demo](https://codepen.io/Asabeneh/full/OJVpyqm).
9090

9191
The input element has many attributes such as value, name, id, placeholder, type and event handler. In addition, we can link a label and an input field using an id of input field and htmlFor of the label.If label and input are linked it will focus the input when we click on label. Look at the example give below.
9292

@@ -133,7 +133,7 @@ const rootElement = document.getElementById('root')
133133
ReactDOM.render(<App />, rootElement)
134134
```
135135

136-
We usually use form to handle use information. Let us move to form section and make use the form element.
136+
We usually use form to handle user information. Let us move to form section and make use the form element.
137137

138138
## Getting multiple input data from form
139139

@@ -442,7 +442,7 @@ class App extends React.Component {
442442
type='color'
443443
id='color'
444444
name='color'
445-
value={color}
445+
value={favoriteColor}
446446
onChange={this.handleChange}
447447
placeholder='Favorite Color'
448448
/>
@@ -930,7 +930,7 @@ ReactDOM.render(<App />, rootElement)
930930
8. What event type do you use to listen changes on an input field?
931931
9. What is the value of a checked checkbox?
932932
10. When do you use onChange, onBlur, onSubmit?
933-
11. What is the purpose of writing e.preventDefault() inside the submit handler method?
933+
11. What is the purpose of writing e.preventDefault() inside the submit handler method?
934934
12. How do you bind data in React? The first input field example is data binding in React.
935935
13. What is validation?
936936
14. What is the event type you use to listen when an input changes?

21_Introducing_Hooks/21_introducing_hooks.md

+1-4
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131

3232
In the previous, section you have learned how to use React with hooks which is the older version. Currently, hooks has been introduced to React.
3333

34-
Hooks are a new addition in React 16.8. They allow you use state and other React features without writing a class component. If we are using hooks we can have only a functional component in the entire application. For more detail explanation you check [React documentation](https://reactjs.org/docs/hooks-reference.html).
34+
Hooks are a new addition in React 16.8. They allow you use state, life cycle methods and other React features without writing a class component. If we are using hooks we can have only a functional component in the entire application. For more detail explanation you check [React documentation](https://reactjs.org/docs/hooks-reference.html).
3535

3636
Different hooks have been introduced to React:Basic hooks and additional hooks
3737

@@ -405,6 +405,3 @@ Convert everything you wrote to React hooks.
405405

406406
🎉 CONGRATULATIONS ! 🎉
407407
[<< Day 20](../20_projects/20_projects.md) | [Day 22>>]()
408-
409-
410-

0 commit comments

Comments
 (0)