Learning Objectives
- Define Web Infrastructure Components: Differentiate between clients, servers, and intermediary network infrastructure.
- Trace the Web Request Lifecycle: Map out the exact step-by-step path a web request takes from URL entry to page execution.
- Understand Domain Name Resolution: Explain how the Domain Name System (DNS) translates human-readable domain names into IP addresses.
- Analyze HTTP/HTTPS Protocols: Identify the structure of HTTP requests and responses, secure TLS handshakes, and standard HTTP status codes.
- Explain Browser Rendering Engine Operations: Articulate how web browsers parse raw HTML, CSS, and JavaScript into the Document Object Model (DOM) and paint pixels to the screen.
Welcome to How the Internet Works: Clients, Servers, and Browsers. Every time you visit a website, stream a video, or send an email, a complex sequence of global network interactions occurs behind the scenes in milliseconds. This lesson breaks down the core architecture powering the modern web, giving you a deep structural understanding of network communication, DNS resolution, HTTP protocols, and browser rendering engines.
The web operates primarily on a Client-Server Architecture, a distributed application structure that partitions tasks between resource providers (servers) and service requesters (clients).
+-------------------+ +-------------------+
| | ---- Request ----> | |
| Client (Browser) | | Server (Web) |
| | <--- Response ---- | |
+-------------------+ +-------------------+
1. The Client
A client is any application or hardware device that requests access to resources on the internet.
- Examples: Desktop browsers (Chrome, Firefox, Safari), mobile apps, smart devices, command-line utilities (
curl). - Role: Formulates requests based on user actions, transmits them across the network, receives structured responses, and renders the output for the user.
2. The Server
A server is a high-performance computer (or software instance running on host hardware) designed to store data, host web applications, and listen continuously for incoming network requests.
- Examples: Apache HTTP Server, Nginx, Node.js applications, cloud servers (AWS, Google Cloud).
- Role: Processes incoming client requests, executes server-side code, fetches data from databases, and returns formatted responses (HTML, JSON, media assets).
Computers communicate over networks using numerical addresses, not human words. The internet relies on IP Addresses and the Domain Name System (DNS) to bridge this gap.
IP Addresses (Internet Protocol)
Every device connected to the internet is assigned a unique IP address:
- IPv4: 32-bit numerical address written in four decimal blocks (e.g.,
192.0.2.1). - IPv6: 128-bit hexadecimal address created to expand available addresses worldwide (e.g.,
2001:db8::8a2e:370:7334).
The DNS Resolution Flow
When you type https://example.com into your browser, the system must resolve that text name into an IP address.
Browser --> Recursive Resolver --> Root Server --> TLD Server --> Authoritative Name Server
(Cache) (ISP / 1.1.1.1) (".") (".com") ("example.com")
- Browser & OS Cache Lookup: The browser checks its local memory to see if
example.comwas resolved recently. - Recursive Resolver Query: If not cached, a request goes to a Recursive DNS Resolver (usually managed by your ISP or a public DNS provider like Cloudflare/Google).
- Root Name Server: The resolver queries a Root Server, which directs it to the appropriate Top-Level Domain (TLD) Server (e.g., the server responsible for
.com). - TLD Name Server: The
.comTLD server provides the address of the Authoritative Name Server responsible forexample.com. - Authoritative Name Server: Returns the target server's actual IP address back to the resolver, which caches it and hands it back to your browser.
Once your browser has the server's IP address, it establishes a network connection using TCP/IP (Transmission Control Protocol / Internet Protocol) and initiates communication using HTTP or HTTPS.
HTTP Request & Response Anatomy
1. HTTP Request
Sent by the client to ask for a resource:
GET /index.html HTTP/1.1
Host: example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Accept: text/html,application/xhtml+xml