33  33. Browsers, Web Servers, and HTTP

Every time you open a web page, two programs have a short conversation: your browser asks for something and a web server answers. This page explains who is talking, what they say to each other (HTTP), and how you will run a web server on your own computer while you build apps.

33.1 Clients and servers

A website “lives” on a computer that is connected to the Internet and is always on. That computer is called a server. A program running on it, the web server program, waits for requests and answers them.

Your browser (Chrome, Safari, Edge, Firefox…) is a client: a program that asks a server for something. When you visit a site, the browser asks the web server for the page, and the server sends back the files needed to show it: HTML, CSS, JavaScript and images (see HTML, CSS, JavaScript, and Browser Developer Tools). The browser then draws the page on your screen.

   Your computer                            A computer on the Internet
 +-----------------+                       +---------------------------+
 |  Browser        |  ---- request ---->   |  Web server program       |
 |  (the client)   |  <--- response ----   |  (the server)             |
 +-----------------+                       +---------------------------+

Think of a restaurant: you (the client) order, the kitchen (the server) prepares exactly what you asked for, and one kitchen serves many tables at once. Note that “server” means both the computer and the program running on it; context tells you which.

33.2 Front end and back end

Developers split an app into two halves:

  • The front end (also called the client side) is everything that runs in the user’s browser: the screens, buttons and forms.
  • The back end (also called the server side) is everything that runs on servers: storing data, checking passwords, applying business rules, charging credit cards.

You will see these terms constantly, often used loosely:

Term Means Example
client a program that asks for something your browser, a phone app, curl
server a program that answers requests (or the computer it runs on) the program that runs amazon.com
front end / client side the part of an app that runs in the browser HTML, CSS, JavaScript
back end / server side the part of an app that runs on servers the code that saves your order
full stack front end and back end together “a full-stack web app”

33.3 HTTP: how browsers and servers talk

HTTP (HyperText Transfer Protocol) is the set of rules - a protocol - that browsers and web servers follow when they talk. Every exchange is one request followed by one response.

A request contains:

  • a method - what you want to do. The two you will see most:
    • GET: “please send me this” (loading a page, clicking a link).
    • POST: “here is some data for you” (submitting a sign-up form, uploading a photo).
  • a path - which page or file, e.g. /about.
  • headers - extra information, such as which site you want and which browser you are using.
  • sometimes a body - the data being sent (for example, the form fields of a POST).

A simplified request looks like this:

GET /about HTTP/1.1
Host: www.example.com
Accept: text/html

The response starts with a status code (did it work?), then headers (for example, what kind of content follows), then the body (the content itself):

HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8

<!doctype html>
<html>
  ...the page...
</html>

One page usually needs many requests. The first response is the HTML. The browser reads it, sees which CSS files, JavaScript files, images and fonts it needs, and requests each of those too. A busy shopping site can make more than a hundred requests to show a single page.

33.3.1 Status codes

Code Name Meaning
200 OK Success: here is what you asked for
201 Created Success: a new item was created (common after a POST)
301, 302 Moved Redirect: go to this other URL instead
400 Bad Request The request didn’t make sense (for example, missing data)
401 Unauthorized You need to log in (or your key is missing or invalid)
403 Forbidden The server knows who you are, but you are not allowed to do this
404 Not Found Nothing exists at this path
429 Too Many Requests Slow down: you hit a rate limit
500 Internal Server Error The server’s code crashed or failed
503 Service Unavailable The server is overloaded or down for maintenance

The first digit tells you the family: 2xx success, 3xx redirect, 4xx the client asked for something wrong, 5xx the server failed. When something breaks, that digit tells you where to look first: a 404 usually means a wrong link or path; a 500 means a bug or crash in the back end.

33.3.2 See HTTP for yourself with curl

curl is a command-line client: it sends HTTP requests from the terminal and prints the response. It comes with macOS and with Git Bash. The -i option (“include”) prints the status line and headers before the body:

curl -i https://example.com

Output (shortened - yours will differ a little):

HTTP/2 200
content-type: text/html; charset=utf-8
server: cloudflare
...

<!doctype html><html lang=en><head>...<title>Example Domain</title>...
  • HTTP/2 200 means HTTP version 2, status 200 (OK). You might see HTTP/1.1 200 OK instead - an older version of HTTP with the same meaning.
  • content-type: text/html says the body is an HTML page.
  • After a blank line comes the body: the HTML your browser would have drawn. curl just prints it as text.

To see only the status line and headers, use a capital -I instead.

33.4 HTTPS: HTTP with encryption

Plain HTTP travels as readable text, so anyone along the way (for example, whoever runs the public Wi-Fi you are on) could read or change it. HTTPS is HTTP sent through an encrypted connection. It:

  • encrypts the traffic, so passwords, card numbers and cookies can’t be read or altered in transit, and
  • proves the server’s identity with a certificate issued by a trusted authority, so you know you are really talking to amazon.com.

Today nearly every site uses HTTPS. Browsers mark plain-HTTP pages as “Not secure”, and many sites automatically redirect http:// addresses to https://. Hosting services set up HTTPS for you (see Hosting and Deployment).

HTTPS protects the connection, not the content: a scam site can have perfectly valid HTTPS.

33.5 One server or thousands?

A small website can run on one web server program on one computer. Large sites such as Google or Amazon run on thousands of computers in data centers around the world, yet your browser still sees “one website”. For learning and for building small apps, the one-server picture is all you need.

  • A load balancer is a “front door” that receives every request and passes it to one of many identical servers behind it. If one server fails, the others keep answering.
  • A CDN (content delivery network) keeps copies of files - images, videos, CSS, JavaScript, sometimes whole pages - on servers in many cities. You get them from a nearby copy, which is faster. Cloudflare, Akamai, Amazon CloudFront and Fastly are well-known CDNs.
  • A cache is a saved copy of something, kept so the same work doesn’t have to be repeated. CDNs, servers and your own browser all cache.

This is why a big site’s address often leads to a computer owned by a CDN company, as you will see with ping and nslookup in URLs, Domain Names, IP Addresses, and DNS.

33.6 localhost: a server on your own computer

While you build an app, you run the web server on your own computer. The browser and the server are then on the same machine.

  • localhost is a special name that always means “this computer”. Only you can reach it; it is not on the public Internet.
  • A port is a number that tells the computer which program should receive a request. One computer can run many server programs at once, each listening on its own port. If the computer’s address is a building’s street address, the port is the apartment number.
  • Public websites use port 443 (HTTPS) or 80 (HTTP). Those are the defaults, so you never type them. Development servers use other ports, which you do type: http://localhost:3000 (Next.js), http://localhost:5173 (Vite), http://localhost:8000 (Python’s built-in server).

Things that will save you time later:

  • A development server runs inside a terminal window and keeps running (you don’t get your prompt back). Press Ctrl+C in that window to stop it.
  • If the server isn’t running - for example, you closed its terminal window - the browser says something like “This site can’t be reached”.
  • Only one program can listen on a port at a time. Some tools then pick the next free port (for example 3001); others stop with an “address already in use” error.
  • A localhost link only works on your own computer. To share your app, deploy it (see Hosting and Deployment).

33.6.1 Try it: run a tiny web server (optional)

This needs Python, which you may have from a programming course. First create a folder with one web page in it:

mkdir -p ~/hello-server
cd ~/hello-server
echo "<h1>Hello from my own computer</h1>" > index.html

Then start Python’s built-in web server in that folder:

python3 -m http.server 8000 --bind 127.0.0.1

If macOS offers to install the “command line developer tools”, accept: they include python3 (and Git).

python -m http.server 8000 --bind 127.0.0.1

If you get an error (or the Microsoft Store opens), try py instead of python. If neither works, Python isn’t installed - just read along.

The command keeps running. Open http://localhost:8000 in your browser and you will see your heading. The terminal prints one line for each request it receives, something like this:

127.0.0.1 - - [06/Oct/2026 10:29:01] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [06/Oct/2026 10:29:01] code 404, message File not found
127.0.0.1 - - [06/Oct/2026 10:29:01] "GET /favicon.ico HTTP/1.1" 404 -

The request came from 127.0.0.1 (your own computer), it was a GET for the path /, and the server answered 200. Many browsers also ask for /favicon.ico (the little icon in the tab); this folder has none, so the answer is a harmless 404. Try http://localhost:8000/nope.html to cause another 404. Finally, press Ctrl+C in the terminal (or close the window) and reload the page: the browser can no longer connect.

Only share what you mean to share

This server hands out every file in the folder where you start it, so start it only inside a project folder - never in your home folder. The --bind 127.0.0.1 part makes it reachable only from your own computer; without it, other people on the same network might be able to connect.

Practice Questions

Easy

Question 1 · Short answer

When you visit a website, which program is the client and which is the server?

Your browser is the client: it asks for the page. The web server program running on a computer somewhere on the Internet is the server: it answers the request and sends back the files needed to show the page.

Question 2 · Multiple choice

What is HTTP?

  1. A programming language for building web pages
  2. The set of rules browsers and web servers follow to exchange requests and responses
  3. A program that stores a website’s data
  4. The address of a website

b. HTTP (HyperText Transfer Protocol) is a protocol: the rules for the request/response conversation. HTML, not HTTP, is the language for pages (a); data is stored by a database (c); a website’s address is its URL (d).

Question 3 · Matching

Match each status code with its meaning.

Code Meaning
1. 200 A. The server’s code crashed or failed
2. 301 B. Nothing exists at this path
3. 404 C. Success
4. 500 D. Redirect: the page has moved to another URL

1 → C, 2 → D, 3 → B, 4 → A.

Question 4 · True or false

The word “server” can mean either a computer or a program running on that computer.

True. People say “server” for both the server computer and the web server program that runs on it. Context tells you which one is meant.

Question 5 · Multiple choice

Which of these is part of the front end of an online store?

  1. The code that charges the customer’s credit card
  2. The database table that stores all orders
  3. The product page and “Add to cart” button shown in the browser
  4. The code that checks whether a password is correct

c. The front end is what runs in the user’s browser: the screens, buttons and forms. Charging cards (a), storing orders (b) and checking passwords (d) happen on servers, so they are part of the back end.

Question 6 · Short answer

What does localhost mean, and who can open a localhost address?

localhost always means “this computer”. Only the person using that computer can open a localhost address; it is not reachable from the public Internet.

Question 7 · Short answer

Name two things HTTPS adds compared to plain HTTP.

  1. Encryption: data in transit (passwords, card numbers, cookies) can’t be read or changed by others on the network.
  2. Proof of identity: the server shows a certificate from a trusted authority, so you know you are talking to the real site.

Medium

Question 8 · Multiple choice

A user fills in a club sign-up form and clicks “Submit”. Which HTTP method is the browser most likely to use?

  1. GET
  2. POST
  3. 200
  4. HTTPS

b. POST is used to send data to the server, such as form fields. GET (a) asks for something without sending a body. 200 (c) is a status code, not a method, and HTTPS (d) is the encrypted version of HTTP, not a method.

Question 9 · Predict the output

Maria runs this command:

curl -I https://github.com/this-page-does-not-exist-xyz

What number do you expect to see on the first line of the output, and why?

404 (the first line will look like HTTP/2 404). The server is up and answered, but nothing exists at that path. -I prints only the status line and headers.

Question 10 · Scenario

Your app shows an error page. In one case the status code is 404; in another it is 500. For each, say whether the problem is more likely on the client side (the request) or on the server side, and what you would check first.

  • 404 (4xx): the request asked for something that doesn’t exist. Check the link or URL path for a typo, or whether the page/route was ever created.
  • 500 (5xx): the server failed while handling a valid request. Check the back-end code and the server’s logs for the error.

Question 11 · Short answer

Explain each part of the address http://localhost:5173.

  • http:// - use plain HTTP (fine for a development server on your own computer).
  • localhost - the server is on this computer.
  • 5173 - the port: the request goes to whichever program is listening on port 5173 (Vite’s development server uses this port by default).

Question 12 · Read the output

While Python’s web server is running, the terminal prints:

127.0.0.1 - - [06/Oct/2026 10:31:12] "GET /about.html HTTP/1.1" 404 -

What happened?

A browser on the same computer (127.0.0.1) sent a GET request for the path /about.html. The server answered 404 Not Found because there is no about.html file in the folder it is serving.

Question 13 · Multiple choice

Which statement about HTTPS is true?

  1. A site that uses HTTPS is guaranteed to be honest and safe to buy from.
  2. HTTPS encrypts the data travelling between your browser and the server.
  3. HTTPS makes pages load without any requests.
  4. HTTPS is only needed on pages that show images.

b. HTTPS protects the connection. It says nothing about whether the site’s owner is honest (a) - scam sites use HTTPS too. Pages still need requests (c), and HTTPS matters for every page, especially ones with logins or payments (d).

Question 14 · Short answer

Why does loading a single web page usually involve many HTTP requests?

The first response is just the HTML. As the browser reads the HTML, it finds references to other files - CSS, JavaScript, images, fonts - and sends a separate request for each one.

Hard

Question 15 · Scenario

Maria starts her app’s development server, which says the app is available at http://localhost:3000. The app works. Later she closes that terminal window, reloads the page, and the browser says “This site can’t be reached”. What happened, and how does she fix it?

The development server was a program running inside that terminal window. Closing the window stopped it, so nothing is listening on port 3000 any more and the browser can’t connect. She needs to open a terminal, cd into the project folder and start the server again (and leave that window open while she works).

Question 16 · Scenario

Sam texts his friend the link http://localhost:3000 so she can try his new app. She gets an error. Explain why, and what Sam would need to do instead.

localhost means “this computer” - on the friend’s phone it refers to her own phone, where Sam’s server isn’t running. A localhost address only works on the computer running the server. To share the app, Sam must deploy it to a server on the Internet (a hosting service) and send her that public URL.

Question 17 · Long answer

A site like Amazon handles millions of visitors at once, yet your browser behaves as if it talks to “one server”. Explain, in plain English, two techniques that make this possible.

  • Load balancers: one “front door” receives the requests and spreads them across many identical servers. If one server fails, the others keep answering, so visitors don’t notice.
  • CDNs (content delivery networks): copies of files such as images, CSS and JavaScript are stored on servers in many cities, and each visitor gets them from a nearby copy. This is faster and takes load off the main servers.

A good answer may also mention caching (saved copies so work isn’t repeated) and many data centers in different regions.

Question 18 · Scenario

Sam already has one project’s development server running on port 3000. He starts a second project that also wants port 3000. What can happen, and what are two ways to deal with it?

Only one program can listen on a port at a time. Depending on the tool, the second server either picks the next free port automatically (for example 3001 - read the terminal output to see which) or stops with an “address already in use” error. Sam can stop the first server with Ctrl+C in its terminal window, or start the second server on a different port.

Question 19 · Read the output

Sam runs curl -I http://amazon.com (note: http, not https) and sees, among other lines:

HTTP/1.1 301 Moved Permanently
Location: https://amazon.com/

What is the server telling him, and why do sites do this?

301 is a redirect: “this address has moved permanently”, and the Location header says where to go instead - the same site over HTTPS. A browser follows the redirect automatically and requests https://amazon.com/; curl only shows it (add -L to make curl follow redirects). Sites do this so that anyone who types or clicks a plain http:// address still ends up on the encrypted version.

Question 20 · Hands-on

Run the tiny Python web server from this page. While it is running, open a second terminal window and run curl -i http://localhost:8000/ and then curl -i http://localhost:8000/missing.html. Compare the first line of each response and the log lines that appear in the server’s window. Then stop the server and run the first curl command again. What changes?

  • The first request returns a status line with 200 and your HTML as the body; the second returns 404. (Python’s simple server answers with HTTP/1.0, an older version of HTTP.)
  • Each request adds a log line in the server window, showing the method, the path and the status code - the same conversation seen from the server’s side.
  • After you stop the server, curl fails with a “connection refused”-style error (“Failed to connect”), because no program is listening on port 8000.

© 2025-2026 Y. Rosenthal. All rights reserved.