The last video we saw how to implement the video detail component.
So now in this video, we'll see how to implement the video list and then video item component.
So here instead of video list, let me know that.
VIDEO.
Let's.
But some props.
The first stop will be video.
Will be reduce.
All the leaders have presented and answer on video select.
Said select relatives.
Said Senator Williams.
So what we are doing is first of sending the videos deliberately so what we do to this planet as alleged.
And then on reducing it, if we are selecting wonders like if you are inheriting the third video from
the video on the right side of the list, then that video should come in to the left side and be visible
in the frame so that how to do will be sending a function called, said Senator.
That means we are sending this function so that we can select the selected video and change accordingly
on what we don't use that is selected.
So now we have to import the video list.
In Port.
VIDEO.
Just.
From our flash components flash video.
So I'll go to the Really or J6 now here will read the quote.
Trusting in both.
React.
From the act.
Import what?
We'll be using the grid components of material, you wait, so we'll.
What grade?
From material you.
Slash caught.
Now, what do we have to do is we'll be building a video item.
OK?
This video item means each video that we'll have like, we'll have a list of five units on the writer
similar to YouTube.
And then each item of that we really need is a video item.
So that will important in the next video.
As of now, we continue with video list.
There's the written part the basic coding business logic behind the video list.
We'll be getting radios and.
On.
Select.
We will.
So lot of this is that basically the problem that we are sending in-app purchase the videos and select
on select video props that we are catching our videos and on select video.
Now.
Now, basically, what we have to do, we have to have done to Great Britain.
Great.
This stuff really was.
It should be container.
And.
Spacing and.
So what this is doing is.
And then we export we have it, we will export the default, honest.
So what this is doing is we are running a grid that contains the whole right part of that and will continue
on the list of values.
So what is this stuff of this is for Disney after the clarity.
Constant.
Lots of videos.
Radios dot the map.
VIDEO, I'll explain your time writing in a while.
That's right, the court as of now.
Should be the ideal item.
On select radio question.
On select.
We do.
There should be a key to that radio.
VIDEO not IED.
Not really.
The video will be video.
So basically, what is this, meaning what is this part of doing?
First thing they see the videos in this videos are object.
We're having all the array like the details of all the videos that are furious.
So now we'll map.
Map means it is basically a form of using a fire loop on each and every item.
So we are getting a single video every, every little, a lot of our look.
And for that video, we are passing it to a video item component.
We are sending that we do and then the key of the video.
So whenever we are using a map function and using component in Z map function, this key this key prop
is a good practice of because each and every component should be off unique key.
So when we are using insert a map function of component, we have to give up.
The key will be the video itself because every video is unique.
So that's that's why the case should be unique.
And then the video that we are sending to this video item is the single item of every detail of the
fire.
Look at the map function and on select video.
If the video is that, it should be like appearing on the left side as a film.
So for that business logic, as I said before, we have to import the video item on song and import
that.
Import radio.
Item.
From Northwest.
We do I.
So basically, we have completed the court for video list.
So now what the doing said the video item.
So basically, when you go into that, you have to create a component called video item.
VIDEO.
I do not discuss.
Once you create the component here, we'll be using great paper typography and a small function to display
all these radios.
All these five videos that we are getting from the YouTube may on the right side of the landing page
so that the porting part of the video item component will see in the next to.