All language subtitles for 003 HTTP in Action_Downloadly.ir_en

So after the kind of heavy, theory lecture,

let's now actually see http in action

and do some requests and take a look

at the responses we got using our browsers developer tools.

So I'm using Google Chrome as my browser,

and I'm here on udemy.com.

So, just go to udemy.com,

and then open your developer tools.

And I am using the command option J for that on my Mac,

on Windows it's probably Alt+Ctrl+J,

or just right click anywhere on the page

and then click inspect,

just in case you're not familiar with the dev tools.

Then, what we're gonna do is to head over

to the network tab.

And then click here on disable cache.

That's important because otherwise

you might be loading the page from your computer

because you've been to udemy.com before.

Okay, so let's now reload the page,

so that we're gonna kind of record

the network activity here in this network tab.

So reload this.

And so now here we can see all the requests

that are happening on the page.

So as I told you, there are gonna be lots of requests

for all the elements that are on the page.

Now if we're going the top here,

the first of all is actually udemy.com.

And we can see here the status code, which is 200,

as I said in the last lecture,

that means okay.

So everything went right.

Then the size and the time it took

to download this resource.

But then, we also have all of these other resources here

like the CSS files you see here,

some images, java script files

like I have here.

And all of these were actually initiated by the index,

so by the root page.

Okay, so we have udemy.com and that one

will then request all of these assets.

So that is the index, so it doesn't happen in initiator,

and all of these here were requested by the main udemy.com.

Now if we click on one of these resources,

and let's do actually udemy.com first.

Here we can get some more information about the request,

and the response.

So first, the request which is actually at the bottom.

And you'll see that the request was made to udemy.com,

we did a get request,

and the path was just the root path,

just like I explained to you in the last video, okay.

Then we have a bunch of headers,

so this here for example means

that the page was compressed using just a gzip.

Down here you have a header for setting some cookies,

and a bunch of other headers

which we will talk about later on.

So this is the request,

and then the response

also has a bunch of all of these headers, okay.

So we can see when the response was actually sent.

We can see a bunch of cookies,

and the status code here as well,

so that's where the 200 status code comes from.

And again, a bunch of other headers,

that we're gonna talk about a bit later, okay.

And the same, of course,

we have for all the other assets that were downloaded.

So the response and the request down here.

And this time we actually see that

the root here is still udemy.com,

so what they call the authority here,

but the path is then all of this,

so this location here,

where the CSS file is located.

And if we actually now browse somewhere here on this page,

let's say to the web development courses,

well, then let's see what happens here.

And, so here, we have this page,

which is the web development resource, okay.

So basically this piece here of the URL.

Remember that this is called a resource,

from the last video.

So if we click on that,

we will actually see that here again, right.

So we have again

udemy.com and the /coursesdevelopment/webdevelopment.

So that is the path where the request is going to.

Here on the left side we can also like preview images

for example, this logo here.

When it's an image, we can see the preview,

we can see the response of it better.

For example, in this one here,

we can actually see the html response that came back.

So instead of just seeing the headers like we did here,

we can actually see the response as well,

and a nice overview of all the cookies that were set

in this request.

Now we didn't talk about cookies just yet,

but again that's something for later.

But I think it's important that you get this overview

of how requests and responses actually look like

under a hood.

So that was exactly the goal of this video,

I hope the message was clear,

and that everything made sense.

And so, let's now move on

and continue talking about backend development in general.