by Derek Jensen
Lessons:19Length:1.8 hours

For full access to all 19 lessons, including source files, subscribe with Elements.
- Overview
- Transcript
2.4 Creating a Guest Component
You may begin to wonder at what point you should create components to manage the structure of the UI as well as data. One of the best times to create a new component is when you will need to repeat the same UI pieces over and over. In this case, we will start to repeat the display of guest objects in our GuestList
. So let's go ahead and create a Guest
component to handle rendering each guest object for us.
1.Getting Started4 lessons, 16:04
4 lessons, 16:04
Free Lesson 1.1Introduction01:01
Free Lesson
1.1
Introduction
01:01
Free Lesson 1.2Prerequisites03:06
Free Lesson
1.2
Prerequisites
03:06
1.3Creating a React App08:22
1.3
Creating a React App
08:22
1.4Adding Bootstrap03:35
1.4
Adding Bootstrap
03:35
2.Creating the Guestbook Components4 lessons, 26:13
4 lessons, 26:13
2.1Basic App Component Structure07:19
2.1
Basic App Component Structure
07:19
2.2Create a Guest List Component04:53
2.2
Create a Guest List Component
04:53
2.3Passing Data to a Child Component08:58
2.3
Passing Data to a Child Component
08:58
2.4Creating a Guest Component05:03
2.4
Creating a Guest Component
05:03
3.Using Hooks in Functional Components2 lessons, 12:28
2 lessons, 12:28
3.1Introducing the `useState` Hook05:28
3.1
Introducing the `useState` Hook
05:28
3.2Lifecycle Events With the `useEffect` Hook07:00
3.2
Lifecycle Events With the `useEffect` Hook
07:00
4.Creating and Editing Guests8 lessons, 52:32
8 lessons, 52:32
4.1Creating a Form to Add Guests06:07
4.1
Creating a Form to Add Guests
06:07
4.2Handling Input Change Events08:15
4.2
Handling Input Change Events
08:15
4.3Handling Form Submissions09:39
4.3
Handling Form Submissions
09:39
4.4Deleting a Guest03:39
4.4
Deleting a Guest
03:39
4.5Create a Form to Edit Guests06:34
4.5
Create a Form to Edit Guests
06:34
4.6State Transitions and Conditional Rendering09:58
4.6
State Transitions and Conditional Rendering
09:58
4.7Editing a Guest04:20
4.7
Editing a Guest
04:20
4.8Introducing the `useRef` Hook04:00
4.8
Introducing the `useRef` Hook
04:00
5.Conclusion1 lesson, 01:40
1 lesson, 01:40
5.1Conclusion01:40
5.1
Conclusion
01:40
Continue watching with Elements
Continue watching with Elements