Stop 01 · Internet & Web BasicsTopics · 5/14

Request-response cycle

In short

Every page load is a conversation: your browser asks, the server answers. One page can need dozens of these round trips, and each one costs time.

The full round trip of a browser sending an HTTP request to a server and receiving a response — the foundation of how every website loads. A single page load usually involves many such cycles for HTML, CSS, JavaScript, images, fonts, and API data, so learning to inspect them is essential for debugging and performance work.

The jaadu runs a chai stall and hands a glass of chai to a student.

Think of it like this

Ordering at a chai stall

You say 'one cutting chai, less sugar' (the request). Bhaiya makes it and hands it over (the response). If he's out of milk, he tells you that instead (an error status).

Watch it happen

Loading example.com/about

Browser

DNS

Server

example.com?

1/6First the browser needs the server's IP address.

The big ideas

What you need to know

A request has a method and a URL

GET reads data, POST sends new data, PUT or PATCH update it, DELETE removes it.

Headers carry extra info

Headers say things like which browser you use, which format you accept and your cookies.

Status codes tell the result

2xx means success, 3xx means look elsewhere, 4xx means the request was wrong, 5xx means the server broke.

One page, many requests

The HTML arrives first, then the browser requests every CSS file, script, image and font it mentions.

See it in code

Walk through the code

http

1GET /api/courses HTTP/1.12Host: example.com3Accept: application/json4 5HTTP/1.1 200 OK6Content-Type: application/json7Cache-Control: max-age=6008 9[{ "id": 1, "name": "Online MBA" }]

1/4The request: method and path on line 1, then headers saying which host and what format we want.

The top half is the request: method, path and headers. The bottom half is the response: status, headers, a blank line, then the body.

Save yourself the pain

Common mistakes

Oops

Treating every non-200 status as 'the server is down'.

Do this instead

Read the code. 404 means wrong URL, 401 means not logged in, 500 means a bug on the server.

Oops

Forgetting that every extra file is an extra request.

Do this instead

Check the Network tab. Fewer, smaller requests usually mean a faster page.

Your mission

Spy on a page load

~15 min

Quick check

Your app calls an API and gets back 401. What does it most likely mean?

Go deeper

1Open the Network tab in DevTools and inspect a real request/response pair. Inspect at least one real example and note what each important field or stage represents.
2Learn the anatomy of an HTTP request: method, headers, body. Focus on understanding the underlying reason it works, not only memorizing the definition.
3Understand status codes (200, 301, 404, 500) and what they signal.