Skip to content

Commit b4e2374

Browse files
committed
minor changes
1 parent 29798cb commit b4e2374

File tree

10 files changed

+46
-34
lines changed

10 files changed

+46
-34
lines changed

Diff for: 07_Day_Class_Components/07_class_components.md

+5-3
Original file line numberDiff line numberDiff line change
@@ -826,9 +826,11 @@ In next section, we will cover state which is the heart of React. State allows R
826826
2. What is inheritance and how do you make a child from a parent class?
827827
3. What is class based React component ?
828828
4. What is the difference between functional React component and class based React component ?
829-
5. What is the use cases of class based component ?
830-
6. What is React life cycle ? (not covered yet) ?
831-
7. What is state in React ?
829+
5. When do we need to use class based components instead of functional components
830+
6. What is the use cases of class based component ?
831+
7. Which type of component do use most frequently ? functional or class-based component
832+
8. What is React life cycle ? (not covered yet) ?
833+
9. What is state in React ? (not covered yet)
832834

833835
## Exercises: Level 2
834836

Diff for: 08_Day_States/08_states.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -500,7 +500,7 @@ I believe that now you have a very good understanding of state. After this, we w
500500

501501
![Change Background](../images/08_day_changing_background_exercise.gif)
502502

503-
2. After long time of lock down you may think of travelling and you do not know where to go. Then make use of this random country selector to select your holiday destination.
503+
2. After long time of lock down, you may think of travelling and you do not know where to go. You may be interested to develop a random country selector that selects your holiday destination.
504504

505505
![Change Background](../images/08_day_select_country_exercise.gif)
506506

Diff for: 09_Day_Conditional_Rendering/09_conditional_rendering.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -764,16 +764,16 @@ ReactDOM.render(<App />, rootElement)
764764

765765
1. What is conditional rendering?
766766
2. How do you implement conditional rendering?
767-
3. Which method of conditional rendering do you prefer?
767+
3. Which method of conditional rendering do you prefer to use?
768768

769769
### Exercises: Level 2
770770

771-
1. Make a single page application which changes the body of the background based on the time of the day(Autumn, Winter, Spring, Summer)
771+
1. Make a single page application which changes the body of the background based on the season of the year(Autumn, Winter, Spring, Summer)
772772
2. Make a single page application which change the body of the background based on the time of the day(Morning, Noon, Evening, Night)
773773

774774
### Exercises: Level 3
775775

776-
Coming
776+
1. Fetching data takes some amount of time. A user has to wait until the data get loaded. Implement a loading functionality of a data is not fetched yet. You can simulate the delay using setTimeout.
777777

778778
🎉 CONGRATULATIONS ! 🎉
779779

Diff for: 10_React_Project_Folder_Structure/10_react_project_folder_structure.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -604,8 +604,8 @@ Well done. Time to do some exercises for your brain and muscles.
604604
## Exercises:Level 1
605605

606606
1. What is the importance of React Folder Structure and File Naming
607-
2. How do we export file
608-
3. How do we import file
607+
2. How do you export file
608+
3. How do you import file
609609
4. Make a component of module and export it as named or default export
610610
5. Make a component or module and import it
611611
6. Change all the components you have to different folder structure

Diff for: 12_Day_Forms/12_forms.md

+4-5
Original file line numberDiff line numberDiff line change
@@ -930,16 +930,15 @@ 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 write 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?
936-
14. What is the event type we use to listen when an input changes?
937-
15. What are event types we use to validate an input?
936+
14. What is the event type you use to listen when an input changes?
937+
15. What are event types do you use to validate an input?
938938

939939
## Exercises: Level 2
940940

941-
1. Validate the form given above (a gif image or a video will be provided later). First try to validate without using any library then try it with validator.js.
942-
2. Coming ..
941+
1. Validate the form given above (a gif image or a video will be provided later). First try to validate without using any library then try it with [validator.js](https://www.npmjs.com/package/validator).
943942

944943
## Exercises: Level 3
945944

Diff for: 13_Day_Controlled_Versus_Uncontrolled_Input/13_uncontrolled_input.md

-10
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,6 @@
2323
- [Getting multiple input data from form](#getting-multiple-input-data-from-form)
2424
- [Exercises](#exercises)
2525
- [Exercises: Level 1](#exercises-level-1)
26-
- [Exercises: Level 2](#exercises-level-2)
27-
- [Exercises: Level 3](#exercises-level-3)
2826

2927
# Uncotrolled Components
3028

@@ -174,14 +172,6 @@ Most of the time we use controlled input instead of uncontrolled input. In case
174172
9. When do you use controlled input?
175173
10. Do you use a controlled or uncontrolled input to validate form input fields?
176174

177-
## Exercises: Level 2
178-
179-
coming
180-
181-
## Exercises: Level 3
182-
183-
Coming
184-
185175
🎉 CONGRATULATIONS ! 🎉
186176

187177
[<< Day 12](../12_Day_Forms/12_forms.md) | [Day 14 >>]()

Diff for: 14_Day_Component_Life_Cycles/14_component_life_cycles.md

+9-3
Original file line numberDiff line numberDiff line change
@@ -537,6 +537,7 @@ class App extends Component {
537537
const rootElement = document.getElementById('root')
538538
ReactDOM.render(<App />, rootElement)
539539
```
540+
540541
Let's use the above two life cycle methods together.
541542
542543
```js
@@ -592,7 +593,6 @@ class App extends Component {
592593

593594
const rootElement = document.getElementById('root')
594595
ReactDOM.render(<App />, rootElement)
595-
596596
```
597597
598598
## Unmounting
@@ -610,13 +610,19 @@ The componentWillUnmount method is the only built-in method that gets called whe
610610
4. What does mounting means?
611611
5. What does updating means
612612
6. What does unmounting means?
613-
7. What is the most common built-in mounting life cycle method
614-
8.
613+
7. What is the most common built-in mounting life cycle method?
614+
8. What are the mounting life cycle methods?
615+
9. What are the updating life cycle methods?
616+
10. What is the unmounting life cycle method?
615617
616618
## Exercises: Level 2
617619
620+
Coming
621+
618622
## Exercises: Level 3
619623
624+
Coming
625+
620626
🎉 CONGRATULATIONS ! 🎉
621627
622628
[<< Day 13](../13_Day_Controlled_Versus_Uncontrolled_Input/13_uncontrolled_input.md) | [Day 15 >>](../15_Third_Party_Packages/15_third_party_packages.md)

Diff for: 15_Third_Party_Packages/15_third_party_packages.md

+17-4
Original file line numberDiff line numberDiff line change
@@ -419,20 +419,33 @@ The [reactstrap](https://reactstrap.github.io/) package allows to use a componen
419419

420420
According to the official lodash documentation, 'A modern JavaScript utility library delivering modularity, performance & extras.'
421421

422+
Try to also learn how to use the package _classnames_ and _validator_.
423+
422424
# Exercises
423425

424426
## Exercises: Level 1
425427

426-
coming
428+
1. What is a package?
429+
2. What is a third party package ?
430+
3. Do you have to use third party packages?
431+
4. How do you know the popularity and stability of a third party package?
432+
5. How many JavaScript packages are there on the npm registry?
433+
6. How do you install a third party package?
434+
7. What packages do you use most frequently?
435+
8. What package do you use to fetch data?
436+
9. What is the purpose of classnames package?
437+
10. What is the pupose validator package?
427438

428439
## Exercises: Level 2
429440

430-
coming
441+
1. Learn how to use Sass
442+
2. Learn how to use axios
443+
3. Learn how to use moment and react-icons
444+
4. Use the validator package to validate the form you had in day 12
445+
5. Use classnames to change a class based on some logic.
431446

432447
## Exercises: Level 3
433448

434-
coming
435-
436449
🎉 CONGRATULATIONS ! 🎉
437450

438451
[<< Day 14](../14_Day_Component_Life_Cycles/14_component_life_cycles.md) | [Day 16 >>]()

Diff for: 17_React_Router/17_react_router.md

+4-2
Original file line numberDiff line numberDiff line change
@@ -1719,11 +1719,13 @@ ReactDOM.render(<App />, rootElement)
17191719

17201720
## Exercises: Level 1
17211721

1722-
Now,you know about React router. Implement your portfolio with react router
1722+
1. What package do you use to implement routing in react?
1723+
2. What is the default export in react-router-dom?
1724+
3. What is the use of the following Components(Route, NavLink, Switch, Redirect, Prompt)
17231725

17241726
## Exercises: Level 2
17251727

1726-
coming
1728+
Now, you know about React router. Build your portfolio with React and implement React router for navigation.
17271729

17281730
## Exercises: Level 3
17291731

Diff for: 18_projects/18_projects.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626

2727
# Projects
2828

29-
Congratulations for making it to this far. Now, you have a solid understanding of React. I believe we have cover most of the feature of React and your are ready to work on projects. What we have cover so far is the old version of React. Starting from Day 20 we will learn React Hooks. In the next three days you will work on only projects.
29+
Congratulations for making it to this far. Now, you have a solid understanding of React. I believe we have cover most of the feature of React and your are ready to work on projects. What we have cover so far is the old version of React. Starting from Day 20 we will learn React Hooks. In the next three days you will work on projects only.
3030

3131
# Exercises
3232

0 commit comments

Comments
 (0)