Now if you were paying attention, you probably noticed that our movies page looks different than our home page. Let's go ahead and compare. So here we have a monospace font and a dark grey background

and our text is white. If we head back to our home page, our background is white, our text is black, and it's quite large. The difference here is how we're returning back the information.

So if we right-click on our browser, jump down to Inspect, and head into the Network tab, this will allow us to inspect the network requests that our browser sends to our server. So let's go ahead and give the page a refresh

to start capturing that, and there we go. We see a number of different things show up. The one in particular that we care about, though, is where the initiator is the document, because this is the request

to our home page, and it's what's sending back what we see within the browser at this point in time. So let's go ahead and click on that, and let's head into the response. Cool, so what we see in the response

matches exactly what we see within the browser, which is what you would expect, because this is exactly what the browser is using to show us our page. But if we click on Raw, this is where we start to see the HTML markup

that makes up the page. And if you recall back to our earlier lesson whenever we were actually inspecting our page, let's dive into our resources, Views, Pages, Home.Edge. The HTML markup that we see in our response

matches what we have defined within this page, including the It Works text. The only thing that's different is this fight declaration right here, which we'll get into at a later point in time.

So the underlying reason why we see something different here as compared to our Movies page, so I'm going to go back to our Movies page now, give it a refresh so that we see the underlying request,

let's click on the request for our document, and now we see the response. We don't have a Raw option at all for this response, and it's just sending back one single line that says "My Awesome Movie."

There is no HTML markup associated with it. And that's because we're just sending back a plain text response for this particular request. Within our request table here, that's even noted within the Type column.

You can see this one here is just plain, whereas if we go back to our Home page, that type is HTML. So how do we make our Movies page an HTML response?

Well, let's go ahead and hide our browser back away, jump back into our Route definitions, and the primary difference between these two Route definitions is that this one is using a render function to render out a specific page,

whereas with our Movies route, all that we're doing is returning back a string. So by default, this will return back just a plain text response, and instead, let's go ahead and get rid of our string,

reach for our CTX, and if you'll recall back earlier, we have a View property within here. And that View property allows us to work with the Edge template engine. So let's go ahead and try to dive into

the View. We can do . there, and look at that, we have a render method that looks relatively similar to what we are calling for our Home page. So let's go ahead and give that a try. So let's do Render.

Okay, and now it's asking for a template path. So the template path is going to be the path to the file that we want to render for this page from within the Views directory. By default,

Edge already knows to look within Resources and Views for our pages, so all that we need to do is to find the path from that point onward, which would be Pages, and then whatever page we make. So let's go ahead

and create a new page by right-clicking on Pages, New File, and let's call this Movies.Edge. Let's jump into our Home page for right now, select everything by hitting CMD/CTRL+A, CMD/CTRL+C

to copy it, jump back into our Movies page, and CMD/CTRL+V to paste it in. Now let's change our It Works text to "My Awesome Movie." We can give this a save,

jump back into our routes, and now we have a template path to provide into our render function. So let's provide Pages, and you'll even see an autocomplete pop up here.

This is thanks to the AdonisJS extension that we installed earlier, and we can populate this with Pages/Movies. Do note that you don't need to provide in the file extension of .edge,

EdgeJS will imply that. So let's give this a save, our server will automatically pick up that change. We can dive back into our browser, let's give our page a refresh, and look at that, now it looks

the exact same as our Home page, except the text says "My Awesome Movie." We can verify that we're now sending back an HTML response via the type right down here in our Network Inspector,

we can even give this a click, and now we have a raw option where we see the underlying HTML. Awesome, so now we have an HTML page, but just having static HTML pages isn't too useful

for a server that can serve up dynamic stuff. So how do we pass in dynamic data into this page and render it out? Well, let's go ahead and hide our browser back away,

and let's see first if our HTTP context has any additional options for us. So let's do "ctx." We know that "view" is primarily for EdgeJS, so let's try searching within there.

So we'll do "." again, we see "render raw," "render raw sync," "render sync," those are all rendering stuff, but then lastly we have "share." That sounds like it might be useful, so let's give it a try.

This is a function, so we can call it, and it's going to ask for data of a type "record string any." This "record string any" is essentially asking for an object

with a key-value pair. So we can provide an object with a key, let's call our key "movie," and let's call the value "my awesome movie." We can jump back into our movies page

by following this underlying text right here within our render function, and hitting "cmd" or "ctrl" click on it, that will jump us straight into our page. And the way that we provide dynamic

data into our Edge files is by entering double curly braces. And now we have access to stateful information provided into this view page. Within our share method, we called

our key "movie," so let's go ahead and try typing in "movie" to see if that works. Let's give this a save, jump back into our browser, we can give our page a refresh,

and look at that, we still see "my awesome movie." Let's hide our browser once more and give ourselves a sanity check just to make sure that it'll work. So let's jump back into our routes, and let's do "another awesome movie."

Give that a save, jump back into our browser, give our page a refresh, and voila, there's another awesome movie. Cool, so now we have dynamic data coming into our page that we're now

rendering out, but we're not quite done yet. There's actually a more streamlined way that we can do this exact same thing. So let's hide our browser back away. If we take a look at the options that our render function has,

you'll see that the second argument is for state information. Well, we're using those double curly braces to gain access to stateful information provided into our EdgeJS files. So what if we tried

providing that state directly via this second argument? You'll notice that the type is "record string any" or "undefined." This means that we can either provide in an object with a key value

pair, or we could provide in "undefined" or "nothing," since this also is completely optional. At this point, we're providing a "nothing," but if we highlight our movie data,

cut it out with Command or Control X, get rid of our share call altogether, let's provide in a comma, and let's paste this back in as the stateful information to our render call.

Give this a save, let's jump back into our browser at this point. We're still seeing another awesome movie, so we can imply that it works. Let's hide our browser back away, give it another sanity check,

switch this back to "my," give this a save, jump back into our browser once more, give the page a refresh, and voila! There is my awesome movie again. So at this point, we know that we have

two different options to provide stateful information into our EdgeJS files that we can render out as HTML.