In this section, we're going to work on a very small optional application.
The goal of this app is to rebuild the YouTube videos application, but use hooks this time around instead
of class components.
Again, Toli optional.
You do not have to do this if you don't want to because we are really just working on an app that we've
already worked on before.
Nonetheless, I think you'll learn a lot to doing it.
And it should be a quick couple of videos, so I would recommend going through this.
But again, totally up to you.
All right.
To actually rebuild this project, we're going to just copy the existing project directory we had created
for the video stuff.
So I've got my folder open here to my workspace where I'm saving all my different projects, going to
find the videos project that we had been working on and just copy that folder over.
After I copy the folder, I'm going to rename that copy to videos Dash Hooks.
Let's give me the name of our project.
And while that's running, I'm going to show you a quick diagram or two.
Just a reminder on some the different components we had created inside that project.
We've got the app search bar, video list, video detail and video item.
Now, video list, video detail and video item are all function components with no state or anything
like that tied to them.
So those three components we really don't have to deal with or change in any way.
However, the app component is making use of both state and lifecycle methods and the search bar is
making use of state.
So we are probably going to have to do a reasonable refactor to the app component to make it use hooks
or probably have to make use of the you state hook and the use effect hook as well.
Then for the search bar, we're probably going to have to make use of the you state hook inside their.
So in general, just really two files we're going to make updates to.
All right.
Back over at my folder, explorer over here, it looks like I've got that copy of the video's directory
going to rename it to videos, dash books.
I'm going to change into that directory at my terminal.
I'm going to start up my crate, react at project inside there.
Back at my terminal.
I'm still running these widgets developments ever going to close that?
I'll change over to the.
Videos, books, project.
And do an NPM start.
All right, so let's take a pause right here when we come back.
Next video, we'll start to make some updates.
First to our search bar component.