All right.
Last a little bit of setup here.
So we have fetched some information that we assigned to page props and we need to make sure that this
information gets down into the page we're trying to display.
There might also be some data say about the current user that we want to share with some header component
that we need to eventually create as well.
So how are we going to share all this information around.
Well down here at the return statement I can replace return data with return.
I'm going to throw in there page props.
And we're also going to pass in current user.
So we need to extract the current user out of this data right here.
So I'll say current user is data dot current user
alternately we could just put in dot dot dot data because remember that object is going to have a current
user property inside of it.
I'm going to delete the console log right there.
So now this information that we are returning from this object is going to show out as props up here.
You'll notice that we kind of kept that same idea of naming page props with Page props.
So whatever we are getting out of get initial props right here is going to show up as page props up
there and we are already passing that information through into the component.
So now in addition I'm going to also pull off current user.
We don't really have anywhere to show the current user with this.
Each one had a right here.
So how about.
Well I guess maybe we do.
Let's try to print out here about current user dot email let's try to show some information about the
current user inside that H1.
All right so let's now save this know flip back over and now I should see if there is my e-mail.
And I've also got you are not signed in which means that now that's better.
I said do a refresh.
So you are now assigned in awesome.
That means that we are correctly executing our initial props for the page.
We're communicating that information down into the page.
We've also got some custom or additional information fetching that is common to all of the different
pages inside our application.
So this is pretty much it.
We've now got a working solution.
Now at this point I want to mention that what we've come up with here is kind of nasty.
And the fact that next J S did not just kind of automatically handle the fact that we want to have get
initial props in multiple locations.
I wish it was a little bit easier to use than this.
If all this stuff seems really confusing that is truly fine in my opinion.
This is a little bit more complicated than it really had to be.
And I think that maybe this API could have been designed a bit more easily to use but that's life.
This is what we get.
And to be honest with you if you are trying to do all this server side rendering stuff from scratch
and not use next yes we would have been running into our own gigantic set of issues so at the end of
the day next to us really does save us time.
OK so we've got information fetching ability or the entire app inside of this app components condition
props.
We also have information fetching ability for individual pages as well.
Let's take a pause right here.
Continue in just a moment.