What Actually Happens When You Press Enter?
You type www.google.com and press Enter. Half a second later, a fully rendered page appears. Nobody taught you to find that remarkable. But as a developer, that half second is your responsibility.
It takes 0.5 seconds. But it touches 7 layers of infrastructure.
Here is every layer, in order.
Step 1: DNS Lookup; The Internet’s Phonebook
Humans remember names. Computers understand numbers. DNS translates google.com into 142.250.190.46.
The lookup chain: your browser cache → OS cache → Recursive Resolver → Root Server → TLD Server → Authoritative Server.
The whole chain completes in milliseconds.
When DNS fails, no website loads at all. It is so foundational that its failure looks like the entire internet is broken.
Step 2: TCP Connection; The 3-Way Handshake
Having the IP address is not enough. Your device and the server need to confirm they are both ready to communicate reliably. TCP handles this with three messages before a single byte of your request moves:
•SYN: “can we talk?”
•SYN-ACK: “yes, let’s talk”
•ACK: “connection open”
On a Lagos to Frankfurt connection, this round trip is 100 to 150ms. On a local server, under 5ms. That gap is why CDN edge nodes matter because they bring the handshake closer to your users.
Step 3: The HTTP Request
With the connection open, your browser sends a structured request. Three parts:
| Part | Purpose | Example |
|---|---|---|
| Request Line | The verb and path | GET /index.html HTTP/1.1 |
| Headers | Context about the request | Host, User-Agent, Cookie |
| Body | Payload (POST/PUT only) | JSON data, form fields |
HTTP methods define intent: GET retrieves, POST creates, PUT/PATCH updates, DELETE removes. Using the wrong method breaks caching. GET requests are cached by default; POST requests are not. If you are using POST to fetch data, you are bypassing the entire caching layer unnecessarily.
Step 4: Client-Server Architecture
Right, so the request has arrived somewhere. But where exactly? And who is allowed to touch what?
The Rule: the client is never allowed inside the kitchen. They must ask the waiter, who asks the kitchen on their behalf.
Think of it like a restaurant. You are the customer. You can read the menu and place an order, but you do not walk into the kitchen yourself. The waiter (the network) carries your request. The kitchen (the server) does the actual work. And the pantry (the database) holds all the ingredients.
Most production systems follow the 3-tier model:
| Layer | Role | Technologies |
| Presentation | What the user sees | HTML, CSS, JavaScript, React |
| Application | Business logic and rules | Node.js, Python, Go, Java |
| Data | Persistent storage | PostgreSQL, MongoDB, Redis |
Each layer talks only to the layer immediately next to it. The browser never touches the database directly. This boundary is a security constraint, not just a convention.
Step 5: Server Processing and REST
So the request has made it past the front door. Now your application server actually does something with it. Here is the typical flow:
• The web server (Nginx, Apache) receives the raw request and routes it inward
• Middleware runs: authentication checks, rate limiting, request logging
• The router matches the URL and HTTP method to a specific handler function
• The handler runs your business logic, queries the database if needed, and builds a response
This is where REST comes in. REST is the set of conventions that makes this process predictable and consistent. The four rules:
• URLs are nouns, not verbs. Use /users/123, not /getUser?id=123
• Use HTTP methods correctly and consistently
• Every request is stateless, it carries everything the server needs to process it
• Structure is consistent: /users returns a list, /users/123 returns one record
A well-designed REST API is one your teammates can read without a dictionary. A poorly designed one is a support ticket waiting to happen.
GET /users // List all users
GET /users/123 // Get one user
POST /users // Create a user
DELETE /users/123 // Remove a user
Step 6: The HTTP Response
The server has done its job. Now it sends back what it found or what went wrong. Every response has a status code, headers, and a body.
Status codes are the internet’s traffic lights. Every developer needs these internalized:
| Range | Meaning | Key Codes |
| 2xx | Success | 200 OK, 201 Created, 204 No Content |
| 3xx | Redirect | 301 Permanent, 302 Temporary, 304 Not Modified |
| 4xx | Client Error | 400 Bad Request, 401 Unauthorized, 403 Forbidden, 404 Not Found |
| 5xx | Server Error | 500 Internal Error, 502 Bad Gateway, 503 Unavailable |
One mistake that drives everyone mad: Returning 200 OK when an error occurs is one of the most common API mistakes. It breaks clients, breaks monitoring, and makes debugging painful. Return the right code every time.
Step 7: Browser Rendering; Code into Pixels
The response is sitting in your browser. It is raw HTML, CSS, and JavaScript. None of it is visible yet. What happens next is actually one of the most impressive things your computer does silently, several times a day.
The browser runs through the Critical Rendering Path:
• Parse HTML → build the DOM tree
• Parse CSS → build the CSSOM
• Combine into a Render Tree (visible elements only)
• Layout: calculate exact positions and sizes for everything on the page
• Paint and Composite: pixels hit the screen
JavaScript can interrupt this pipeline at any point. A 200kb render-blocking script sitting in the wrong place is the difference between a 0.5 second load and a 3 second one. On a 3G connection in Kano or Benin City, that delay is not a minor inconvenience. It is the difference between a user who waits and one who closes the tab.
HTML is the blueprint. CSS is the paint bucket. JavaScript is the interior designer rearranging furniture after the house is built. The browser does all of it in under 200 milliseconds.
The Full Journey at a Glance
| Step | Layer | What Happens |
|---|---|---|
| 1 | DNS Lookup | Domain name resolved to IP address |
| 2 | TCP Connection | 3-way handshake establishes reliable channel |
| 3 | HTTP Request | Browser sends method, headers, and body |
| 4 | Client-Server | Request routed through 3-tier architecture |
| 5 | Server Processing | Business logic runs; database queried; response built |
| 6 | HTTP Response | Status code, headers, and payload returned |
| 7 | Browser Rendering | HTML, CSS, JS converted to pixels |
What’s Next?
You now know what happens every time a user hits your app. DNS finds the address, TCP builds the connection, HTTP carries the message, your server does the work, and the browser makes it visible. Seven layers, half a second.
The next question is: what happens when a million users do all of that simultaneously? Look out for my next post.
Top comments (0)