Back to Blog
Lesson 5 of the System Design: System Design Fundamentals course
ArchitectureJuly 16, 20264 min read

Introduction to Client-Server Communication for System Design

Master the request-response cycle and learn to distinguish between client and server responsibilities in this essential lesson on HTTP networking.

HTTPclient-serversystem designnetworkingbackend
Detailed image of illuminated server racks showcasing modern technology infrastructure.

Previously in this course, we explored The Role of the Load Balancer to distribute incoming traffic. Now that we know how traffic arrives at our infrastructure, we need to understand the fundamental mechanics of the dialogue between the user’s browser and your backend services.

The Request-Response Cycle Explained

At its core, the web is a conversation. A client (usually a browser or mobile app) sends a request, and a server returns a response. This is the HTTP protocol in action.

When you type a URL into your browser, the following steps occur:

  1. DNS Resolution: Your browser translates the domain name into an IP address. We covered this in Understanding DNS and Domain Resolution.
  2. TCP Handshake: A connection is established between the client and the server.
  3. The Request: The client sends an HTTP message containing a method, a path, headers, and (optionally) a body.
  4. The Response: The server processes the input and returns a status code, headers, and the requested data.

Visualizing the Flow

Flow diagram: Client Browser -- "1. Request Method, Headers, Body " → Load Balancer; LB -- "2. Forwarded Request" → Backend Server; Server -- "3. Response Status Code, Headers, Data " → Load Balancer; LB -- "4. Response" → Client Browser

Analyzing HTTP Headers and Payloads

HTTP headers are the metadata of the web. They tell the server what kind of content the client expects (Accept), what format the client is sending (Content-Type), or how to manage caching.

Consider a standard POST request to create a user:

HTTP
POST /api/users HTTP/1.1
Host: api.example.com
Content-Type: application/json
Authorization: Bearer <token>

{"username": "jdoe", "email": "jdoe@example.com"}
  • Request Line: POST /api/users HTTP/1.1 defines the action and the protocol version.
  • Headers: Provide context. The Authorization header is crucial for security, while Content-Type ensures the server knows how to parse the JSON body.
  • Body: The actual data payload.

When the server replies, it includes a status code:

  • 200 OK: Everything went well.
  • 201 Created: A resource was successfully created.
  • 400 Bad Request: The client sent invalid data.
  • 500 Internal Server Error: Something broke on the server side.

Client vs. Server Responsibilities

A common pitfall for beginners is blurring the lines between these two entities. Maintaining a strict separation is the key to building scalable systems.

ResponsibilityClientServer
Data ValidationUX feedback (inline checks)Security (Truth source)
Business LogicUI transitionsData persistence/calculations
AuthenticationStoring the tokenVerifying the token
StateSession managementStateless (mostly)

As noted in our discussion on Statelessness in REST, your server should ideally not track client state. If the client needs a "session," it should send the necessary credentials with every request, allowing the server to remain decoupled and scalable.

Hands-on Exercise: Inspecting Traffic

Open your browser's Developer Tools (F12) and navigate to the Network tab. Refresh this page.

  1. Click on any request (e.g., a .js or .css file).
  2. Look at the "Headers" section.
  3. Identify the Request Method, the Status Code, and the User-Agent header.
  4. Practice: Find a request that returns a 200 OK. Try to find one that returns a 304 Not Modified. Why would a server return a 304 instead of a 200? (Hint: It relates to caching, which we will cover in future lessons).

Common Pitfalls

  • Trusting the Client: Never assume data from the client is safe. Always re-validate input on the server, as client-side checks can be bypassed easily.
  • Over-reliance on Headers: While headers are useful, they can be stripped or modified by proxies. Do not rely on custom headers for mission-critical security logic without proper verification.
  • Chatty Communication: Making too many requests to a server for small pieces of data creates massive overhead. This is why API design is so critical—we want to minimize round-trips.

FAQ

Why does the client-server model matter for scaling? By separating the concerns, you can scale the client-facing UI independently of your backend API. You can also add load balancers or caches between them without changing the core logic of either side.

What is the difference between an HTTP request and an HTTP header? A request is the entire package being sent. A header is just one specific part of that package, used for metadata.

Can a server ever act as a client? Yes. In a microservices architecture, one server often calls another server to fetch data. This is "server-to-server" communication, but it uses the exact same HTTP request-response principles.

Recap

We’ve traced the path of an HTTP request, analyzed how headers provide essential metadata, and established the boundary between client and server responsibilities. Understanding these fundamentals ensures your system design remains modular and secure.

Up next: Choosing Between RDBMS and NoSQL, where we determine where to store all that data your server is receiving.

Similar Posts