So now they'll be setting up our API so that we can get our data.
So for that purpose and inside our components folder will be creating another component, and this time
we'll be calling it APIs Dodgers.
And hit enter now, as you might recall, we have already installed Axios inside avocados.
Jason, we have installed Axios as well as notice.
So now it's time to use that Axios folder.
So let's just import at Axios.
Now inside this excuse will be creating a component, and it's just great a function export default.
Axios Dot read, this is basically an Axios instance and said this will be having an object which is
going to have a base you order, which is going to be equal to the API APIs.
You also just baseless this.
You are inside this and that is at GDPs making bad API conduct slash apps slash, which has been provided
to you and Winston done.
But I semicolon and hit save now.
Head back to your ad dodges now inside dodges.
What they're going to do is that will be creating another hook or calling into the hook from a React
module, and that is yours if I took.
And right beneath the.
States will be initializing are you as a factor?
So this huge effect took is going to have another function.
So let's make an error function and instead this year the fact, OK, let's create a constant with the
name reserved.
And once you make, this will be going to political to expose novelty importance to us and really we're
putting up get statement and some embracing that excuse.
So now we have imported Axios, now we are going to give it the queries that we want.
So inside the Axios get, we'll be putting up backpacks.
Now inside this tactic, we are going to give it a slash and characters.
Characters and after characters, we are going to put up a question mark and the name of the character
that we want to search for and the name is going to be equal to dollar equity.
So this name is going to be called to dollar and the query that we have received through our search
bar.
So basically, this is a sin tax that we're following.
No hit save.
So now as you know that this function, the use effect function is.
Going to need the await keyword.
Therefore, we will make sure that the constant result is inside a function that is and is a function.
So let's just create an easy async function, so let's create a constant.
And name this function, for example, fetch items.
And then again, this function is going to be in.
Async function so that we can use the await keyword inside it and inside this let's just move work constant
inside this block and in front of our excuse, we're going to put up the await keyword.
OK, so we have configured our results now.
This results need to go into item, so after this will be setting are items that items, so we will
be using the setup function to set items.
So set items.
Which should be equal to results.
Stored data.
So after this, we will be setting out loading loading, which initially is false, therefore we will
just make it true.
Initially, we want it to be true.
And when this completes, we want the loading to be turned to files.
Now the question arises, when do we want this huge effect to render?
So we wanted rendering every time there's a change in our query.
That means every time you use a searching combat tractor use, if a hook should render, therefore will
be after just off the server inside the squared basis, we will be putting up clearly.
We wanted it to be rendered every time we get equity hit save.
OK, so now we have call function.
Now it's time to call it so right of the fetch.
Items will be calling out for each item function.
So let's go fetch items.
So this is the function body, right, and we need to call this function.
Therefore, we are calling it inside.
I use if I took as well as we have the body of the function inside out you as a backdrop.
So now let's just hit save.
OK, so we have set about items as well as loading.
Now, the only pieces of state that remains inside this particular block is to pass that data into a
catalyst.
So that's what we'll be doing next.