We just set up react navigation.
Now we're going to make a very small change to our act J.S. file if we call.
We took a look at a diagram like this right here and we had said that we're going to wire up some react
component called our blog post provider and that's going to somehow wrap every other component inside
of application including the react navigation stack Navigator.
So in this video we're going to create essentially this provider.
It's not going to actually do anything just yet.
Essentially it's just going to be an empty component.
That just shows the stack navigator inside of it.
But eventually we're going to come back to the provider and start to add a lot of code to manage our
list of blog posts and all that kind of good stuff.
So let's figure out how we can somehow wrap the stop stack navigator with our own custom component.
So going to flip back to my app dot J.S. file you might recall that inside of here at the very bottom
we call that thing called Create app container and passed in our navigator.
The one requirement of our app dot J.S. file inside of any reactivated project is that we have to export
a react component.
So when we call create app container that takes in our navigator and essentially just returns a very
simple react component that shows some very particular component on the screen like maybe our index
screen.
So in order to somehow wrap everything inside of your or everything inside of application rather than
exporting our create app container right here I'm going to instead assign the results of that to a variable
that I'll call simply app.
Like so and then instead I'm going to export default my own custom component my custom component is
not really going to be doing a whole lot.
It's essentially just gonna be a very simple function that's going to return app like so I'm gonna save
this right here.
I'm gonna make sure my application still works.
Looks like I got a little air here I am getting an error of can't find a variable of react that's because
I'm making use of some J.S. X inside of here anytime we want to make use of J.S. X we have to import
react into the file so I can make sure I go up to the top and add in an import for react from react
like so and now I see the same application once again.
So all we did was rather than directly exporting the app that we create with create our container.
We've now simply wrapped it inside of our own custom component.
So now we can start to add in some more interesting code inside of here to somehow wrap that app and
do some additional things to it.
Now we've put this together.
I know this seems like maybe a small change or a weird change but it's going to set us up for what we're
going to add in the next video.
So quick pause and I'll see you in the next video.