0% found this document useful (0 votes)
3 views

Exercise 11_React Component 2

This document outlines an exercise focused on understanding and creating React components, which are essential for building user interfaces in React applications. It includes tasks such as creating a to-do list, a calculator, and a search filter, along with hints for implementation. By completing these exercises, users will gain a solid grasp of React components and their usage.

Uploaded by

nhanhcungbanthan
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views

Exercise 11_React Component 2

This document outlines an exercise focused on understanding and creating React components, which are essential for building user interfaces in React applications. It includes tasks such as creating a to-do list, a calculator, and a search filter, along with hints for implementation. By completing these exercises, users will gain a solid grasp of React components and their usage.

Uploaded by

nhanhcungbanthan
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

Exercise 6: React Component

Objectives and Outcomes

A React component is a reusable building block in React, a popular JavaScript library for
building user interfaces. React components are the fundamental units of a React application
and are responsible for encapsulating UI logic and rendering elements on the screen. By the
end of this exercise, you should have a good understanding of React components and how to
create and use them in your applications.

Exercises

1. Create a to-do list application with add and delete functionality.


2. Create a calculator that can perform basic arithmetic operations
(addition, subtraction, multiplication, and division) .
3. Build Search filter in React

Hint:
 Declare React component states for search input values.
 Create HTML input text for entering search term and update state in onChange function.
 Add Array.filter() on list of items with search term value.

Conclusion

After learning about React components, you should now have a solid understanding of how
to create and use them in your React applications.

You might also like