‫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.