OK, so now let's create our global context.
So we'll create that inside the context folder.
So for that, let's go to the source folder or the US actually folder and create a winner inside this
folder.
So let me create a folder named as contacts.
And next and inside the context, I will create the file that will be delayed for context it context
providers or yes.
OK.
And inside of this file.
So let me get the boilerplate quote so that will be controlled should be and this search and odyssey.
So insert this.
I have already important react with the help of this extension.
So inside of that, I will import also a few more things.
So that would be create context and use context.
Use context, and next, we'll be using the used to talk who used it will be important all of this.
I have like imported in advance so that we don't get any errors at the time of using them.
So, OK, and we will define our context here.
So that will be concert and did context.
For context, and this is equal to the create context and and this so now we have definitely we have
created our context.
And now we will go to the website from where we will be grabbing our EPA.
So let's go to the browser and go to the website of Rapid EPA.
So from there, we will be getting all the EPA.
So that is the website that EPA dot com, if you come and you will be delighted to hear and know what
you will do is for first of all, you need to log in to this website to get the EPA and get the EPA
keys and then use them in your own application.
So after you log in, you can log in with Google.
I have done this.
So after you log in with Google, what you need to do is you need to search your the Google search API,
so you need to just write Google Search.
And the second one here.
So this is why the API geek so this you need to see and this will be loading your API playground.
And this this is the BI API.
So this API will be making use in our project.
So let it load, let the playground load and the.
So now it's loaded and we get the testing link, so from here you can test the API endpoint.
So I've already done that.
That's why I will not see some steps which you might see.
So once you click on this to test and point, it would be redirect to a page where it would be the pricing
section like zero dollars, two dollars.
So you just choose these $0 one, $0 that is the free one.
And you get, I think, around 500 request by a month in that.
So that is OK for testing purposes.
And after that, you need to come here and see you have the API keys who just copy it and pasted somewhere.
And then you have the you are clear.
So this you are told we need to copy.
So I will copy it to till v one, because after this part, the search part will be dynamic.
So we don't want to start telling you, all right, well, we'll just copy it from this tool we want.
So Bill, we want, we will copy it and then we will go back to our idea that this device could.
After coming here, what we will do is we will create a variable which will be known as a base you ordered
and we will be calling it base.
You are real and we will be storing are you are inside this.
So this is the you are in basically and this we are going to store here.
OK, next.
Inside the function, we will be passing some props inside the function.
So that is an object, basically.
So the function is the way it's getting.
Yeah.
So the function is state context border.
Inside this will pass the prop, which will be children, so children will be the prop, which we are
going to pass inside it.
And now what we'll do is we will create some hooks.
So the first one would be the results and we will call it results.
And that will be a function which is responsible for altering or changing this particular variable.
So after results, we will write search results and.
Senators also will be responsible for changing the results, and you will vote the you state and inside
of this.
We will give an empty.
OK, so after this, what we'll do is we'll set another hook and that will be for the loading part.
So Konst said this that would be the loading.
And then we will have the Senate loading.
So said Loading.
And this is a call to again use state.
And inside of this, there will be the initial value for this loading.
So this is a Boolean, so will give the value as false for this.
So this is the.
And the beginning.
It'll be false.
And next we'll be having the another hook.
So that will be these search term.
So here it will be the search.
Term and then the function responsible for making changes inside this variable.
So after these search term, we will have the SEC.
Search, search, search.
Yeah.
So we will give the initial value for it now, this is a spring basically so used to it, and we will
give an empty string as the initial value for this.
Now see you one thing.
How do we know what is the data?
What type of this particular variable?
How do we know that this is a string or a Boolean or an area or an object?
How do we know who thought and knew which we give inside those used to aid whatever the value was?
You pass here so that values use basically the initial value, right?
We are calling it the initial value for this variable.
But as like along with the initial retrieval, what does it and imply is that whatever is the type of
this variable initial value, that is the type of this variable, for example, here we have given it
as an empty area with that simply means that result is an empty array.
We have given the value as false, and this simply means that this loading variable is a boolean type
that we have given is an empty string.
So that simply means that search term is an empty string.
That is what we actually do in order to, like, define the children who now are coming back.
So now what we will have is we'll have another constant.
So that will be the exact results for getting the desired results.
And so this is basically async functions.
So async and this will be, you are told as an argument this is be getting as you are.
And what it will be returning is that asset loading, certain loading and start loading will be the
true.
And next, we'll be having the cast and the series is equal to dessert, basically.
And from here, we'll be getting fetching data.
So here we will use the R word function.
You're thinking of it basically.
There it is.
Obviously, there will be a vote and then we'll fetch.
And so the Fed will have a Bektic.
We'll have this our dollar symbol.
And inside of this, there will be a sort of a base for you all.
And next, we will have another dollar symbol and insert of this will be have an equal.
So after this, we will give.
Bulma and inside of this, there will be another currently basis and here that will be the headers.
So headers, yeah, the headers and inside of this, that is an object, basically.
And the first element here is the extra rapid API horse.
You can copy it from here, basically.
And this this thing right here, it's a rapid EPA host and rapid API key.
So both the things you can just go hard and copy it.
So I will copy this.
Next to come here, and we will post this here.
But just to make things harder.
That is the API host and that a rapid FBA keep well, this is the key which I'm using.
Don't use the scheme, generate your own key and then be stored here because I will be delivering this
key after this project.
So gender their own key and then use it.
So next, we will be having another constant after this.
So that will be the data.
So of course, data is equal to all of it and then start going.
And this is basically draining the data.
And the next we will said that Israel's sacked results to what they've done.
And we will have this settled in two falls like no other data has been fetched, and we don't need to
like like keep on drooling spinner, after all, we have finished.
Loading So why do you need that?
OK, so that means that we will stop downloading.
The next will come to return and insert the return.
We will not have any kind of device will delete this dev and therein provide the fantasies and insert
this.
That will be the text providers.
So that will be the context dart provider.
OK.
So it gave me, although it was intact, not inside this provider, there would be new values so that
the value and this will be an object, basically.
And here there will be the first thing is to get results.
And the second will be the results, and it will be the third St..
For will be this third search term.
And next will be loading.
So these variables or functions, whatever they are, they're inside this value.
So.
The that thing is now set to blow like these things are now global and they can be used anywhere inside
any component where we will improve the student text provider.
So that is a really good use of the global context.
Basically, all we can do the same thing using Redux also like Redux, is also state management, the
library for React, basically.
And we can use Redux also.
But if we're like we are making use of the native concept, that is that is more but like, I think
that is more efficient than rapid.
So next inside this, we will pass these children.
So children and this will be and after that, don't forget to export the corn stand here, so and sport
we want, we can just export this from here only like the berries are functional.
Yeah, this function, we can export it in line also if we want, so we can just try it like this export
and function.
Basically, there's no problem with that.
And now we will export the two functions one by one.
So here we will.
Right export concept and use state context.
And that will be equal to a function.
And this is the U.S.
Context.
Use context and insert this that will be this state context.
Cool, cool, cool, cool, cool.
Yeah.
So this is basically the idea of the whole thing, and we already exported this oil and now state context
provider is completed, and now we are ready to use all of the values and other components.
So next, we'll be building the results component and we'll be making use of all the components inside
the deserts we'll see in the next video.