At the end of the last video I said I was going to let you give a shot had this exercise without me
doing any introduction but I figured you know what this one was actually a little bit more challenging
so I just want to very quickly tell you what to do inside this next exercise.
OK.
So in this exercise you'll notice that we have another component right here and it's showing a lot more
GSX that we've worked with previously.
The result of all that GSX are these two panels you see over here.
Now we used to refer to these panel looking things as segment's.
So we've got one segment right here and a second segment right here.
The overall outline like this kind of border the rounded edges the gray stuff as the background are
identical between the two segments but the child where essentially the content of either segment is
significantly different.
So what you want to do is take a look at this GSX and figure out some way that we could kind of extract
just the segment portion or just the thing that's giving us that styling into a separate component.
Now as a big hint to you the only thing that we really want to extract here is the GSX that is duplicated
in both of these little portions right here and a duplicated GSX is just this div with the class name
of UI placeholder segment.
So essentially just take this div right here and the closing tag right there.
Extract those into a separate new component and make use of that new component inside of the app.
These should result in something that looks identical but now has an additional component that can be
reused very easily in the future without necessarily having to memorize these class names.
So try not to overthink it.
You really only have to change a couple of lines of code into here after creating that new component.
And don't forget to render some children inside of a new component.
We reference props.
Children know like I said this is a more challenging exercise.
So if you have any trouble with that whatsoever feel free to just pause and go over to the next video
and take a look at the solutions.
OK.
So give it a shot and I'll see you in just a minute.