How the Web Works
Understand the full request-response cycle: DNS resolution, HTTP/HTTPS, TCP handshakes, status codes, and browser rendering.
Learning Objectives
- → Trace a URL from browser to server and back
- → Explain DNS resolution and what a resolver does
- → Describe the HTTP request/response structure
- → Identify common HTTP methods and status codes
- → Explain the difference between HTTP and HTTPS
The Big Picture
When you type https://example.com and press Enter, six things happen:
- DNS Lookup — browser resolves
example.comto an IP address - TCP Connection — 3-way handshake with the server
- TLS Handshake — for HTTPS, negotiate encryption
- HTTP Request — browser sends
GET / HTTP/1.1 - HTTP Response — server replies with HTML + status code
- Rendering — browser parses HTML, fetches assets, displays page
DNS Resolution
DNS (Domain Name System) translates human-readable names to IP addresses.
Browser → Recursive Resolver → Root Nameserver
→ TLD Nameserver (.com) → Authoritative Nameserver
← IP address (e.g. 93.184.216.34)
Key record types:
| Type | Purpose |
|-------|--------------------------------|
| A | Domain → IPv4 address |
| AAAA | Domain → IPv6 address |
| CNAME | Alias to another domain |
| MX | Mail server for domain |
| TXT | Arbitrary text (SPF, DKIM…) |
| NS | Authoritative nameserver |
# Query DNS manually
dig example.com A
nslookup example.com
host example.com
TCP Three-Way Handshake
Before any HTTP data flows, TCP establishes a connection:
Client → SYN → Server
Client ← SYN-ACK ← Server
Client → ACK → Server
Then data flows. On close: FIN/ACK exchange.
HTTP Request Structure
GET /login HTTP/1.1
Host: example.com
User-Agent: Mozilla/5.0
Accept: text/html,application/xhtml+xml
Cookie: session=abc123
Connection: keep-alive
[blank line]
[optional body for POST/PUT]
HTTP methods:
| Method | Use |
|---------|------------------------------|
| GET | Retrieve resource |
| POST | Submit data / create |
| PUT | Replace resource |
| PATCH | Partial update |
| DELETE | Remove resource |
| HEAD | Headers only, no body |
| OPTIONS | List allowed methods |
HTTP Response Structure
HTTP/1.1 200 OK
Content-Type: text/html; charset=UTF-8
Content-Length: 1256
Set-Cookie: session=xyz; HttpOnly; Secure
Cache-Control: no-cache
<!DOCTYPE html>
<html>...
Status Code Families
| Range | Meaning | Examples |
|---|---|---|
| 1xx | Informational | 101 Switching Protocols |
| 2xx | Success | 200 OK, 201 Created, 204 No Content |
| 3xx | Redirect | 301 Moved, 302 Found, 304 Not Modified |
| 4xx | Client Error | 400 Bad Request, 401 Unauth, 403 Forbidden, 404 Not Found |
| 5xx | Server Error | 500 Internal Error, 502 Bad Gateway |
HTTPS & TLS
HTTPS = HTTP over TLS (Transport Layer Security).
TLS handshake steps:
1. Client sends ClientHello (supported ciphers, TLS version)
2. Server sends certificate + ServerHello
3. Client verifies certificate against trusted CAs
4. Key exchange (ECDHE) → shared session key
5. Encrypted communication begins
Security headers to know:
Strict-Transport-Security: max-age=31536000; includeSubDomains
Content-Security-Policy: default-src 'self'
X-Frame-Options: DENY
X-Content-Type-Options: nosniff
Cookies
Cookies persist state across stateless HTTP:
Set-Cookie: session=abc123; HttpOnly; Secure; SameSite=Strict; Max-Age=3600
Flags:
- HttpOnly — JS cannot read (prevents XSS theft)
- Secure — HTTPS only
- SameSite — CSRF protection
DevTools – Inspect Network Traffic
Open DevTools → Network tab:
- See every request/response
- View headers, cookies, timing
- Right-click → Copy as cURL
# Replicate with curl
curl -v https://example.com
curl -I https://example.com # HEAD only
Open your browser DevTools (F12) → Network tab. Visit https://example.com. Find the first GET request. Note the status code, Content-Type header, and response time.
What HTTP method does a browser use to load a webpage?
What status code means the request succeeded?
Run dig example.com A and dig example.com MX. Note the IP from the A record and the mail server from MX. Then run dig +trace example.com to see the full resolution chain.
What DNS record type maps a domain to an IPv4 address?
What tool queries DNS records on Linux?
Run curl -I https://httpbin.org/get. Identify: status code, Server header, Content-Type, and any security headers present.
What curl flag shows only response headers (HEAD request)?
What cookie flag prevents JavaScript from reading the cookie?