DEV Community

Akhil
Akhil

Posted on

How browsers, servers, HTTP, and APIs really work

You have written your first lines of HTML. You have styled a button. You have maybe even made something move on screen. But then someone says the words "client-server architecture" and your brain quietly closes a tab.

Do not worry. Nobody explains this well the first time. So let's fix that with food.

Every time you load a webpage, you are placing an order at a restaurant. The internet is just a very big, very fast dining room.

The Restaurant You Never Noticed

Imagine you walk into a restaurant. You sit down and tell the waiter: "I'd like the pasta, please." The waiter walks to the kitchen, the chef makes your pasta, and the waiter carries it back to your table.

That is literally the internet. Every single time you type a URL and press Enter.

You are the browser. Chrome, Firefox, Safari your browser sits at the table and asks for things on your behalf. The waiter is HTTP, the set of rules that carries your request to the kitchen and brings the food back. The kitchen is the server a computer somewhere in the world that you never see, but that does all the actual work. And the food? That is the HTML, CSS, images, and data that load on your screen.

That is the entire model. Everything else in web development is just details inside this loop.

The Address on the Envelope

Now let's talk about URLs. When you type https://google.com/search?q=cats, what exactly is happening?

Think of a URL like a postal address. google.com is the building. /search is which floor and room you want. ?q=cats is the sticky note you tuck into the envelope that says "also, specifically, I want the cats version of this."

The browser reads this address, packs up your request like a letter, and sends it out into the internet. The server at the other end reads the address, finds what you need, and sends it back.

But here is the part most people skip: your request has a method. A verb. It is not just "here is my address" it is "here is my address, and this is what I want to do."

The Four Things You Can Ask For

There are only four. That is it.

GET means "Can I see this?" You are asking to read something. Like asking the waiter what is on the menu. Nothing changes. You just want to look.

POST means "I want to add something new." You are sending new information to the server. Submitting a sign-up form. Posting a tweet. You are handing the kitchen a brand new order.

PUT means "I want to change something." Like calling the waiter back and saying "actually, make that pasta with no garlic." You are updating something that already exists.

DELETE means "Take this away." You are asking the server to remove something. Like asking the waiter to clear a dish from the table.

These four — GET, POST, PUT, DELETE are the whole vocabulary. Every interaction between a browser and a server uses one of these. Every. Single. One.

What the Server Writes Back

When the server gets your request, it sends a response. That response always has two parts: a status code and a body.

Think of it like sending a letter and getting a reply. The reply starts with a short signal "Yes, here it is" or "I moved, try this address" or "Sorry, I don't have that" or "Something exploded in the kitchen." Status codes are exactly this. A short, numbered way for the server to say how things went before giving you the actual content.

200 means everything worked. Here is what you asked for. 404 means the server looked everywhere and that page does not exist. 500 means something broke on the server's end — not your fault, just wait. 401 and 403 mean you are not allowed in. Members only.

You will see these numbers constantly once you start building things. They will stop feeling mysterious very quickly.

*What is an API, Then?
*

You will hear this word constantly. API. Application Programming Interface. It sounds like a government document. It is not.

An API is just a menu. A list of things you are allowed to ask for, and what you will get back.

When a restaurant prints a menu, they are saying: "These are the things we make. Ask for these using these names. Do not ask for things not on this list." An API is a server doing the exact same thing except instead of food items, it lists URLs and methods you can call.

Here is a real example. You are building a weather app. You do not have weather data. Nobody does, except a weather company. That weather company built an API. It says: "Send a GET request to /weather?city=Paris and we will send you back Paris's weather." You do exactly that. You get back a tidy package of data. Your app shows it. Done. You did not build the weather system. You just knew how to order from its menu.

That data usually comes back as JSON. JSON stands for JavaScript Object Notation, but forget the name. It is just a structured way to write information so both humans and computers can read it. Labeled boxes inside labeled boxes. The browser reads it and knows exactly where everything is.

Putting It All Together

Let's walk through what happens the moment you type a URL and press Enter the full story, no gaps.

First, your browser reads the address and looks up the IP address of the server using something called DNS. Think of DNS as the internet's phone book. It turns "google.com" into a real numeric address that computers understand.

Second, the browser builds a GET request like writing a letter and sends it through the internet to that address.

Third, the server receives it, reads what you want, fetches it from its database or files, and packs everything into a response.

Fourth, the server sends back a status code and the HTML, CSS, JavaScript, and images for the page.

Fifth, your browser reads all that code and paints the page you see on screen. What looks like magic is just a browser reading instructions very, very quickly.

From step one to step five, in most cases, this takes under a second. Every single page load. Every single time.

Want to see it yourself? Open any webpage, right-click anywhere, and choose Inspect. Click the Network tab. Refresh the page. You will see every single request your browser made, what status code came back, and how long each one took. The restaurant's full order history — live.

Why This Changes How You Think

Once you understand this model, everything in web development starts to make sense. Why does a login form submit to a URL? Because it is sending a POST request to the server. Why does clicking a delete button sometimes need a confirmation? Because DELETE is permanent the waiter is taking the plate away and washing it.

Why do some pages load fast and others do not? Because some kitchens are better organised than others. The browser asked for food. The question is how quickly the kitchen can make it.

Every framework you will ever learn React, Vue, Next.js, Django, Express is just a different way of either asking the question faster or answering it better. But the request and response cycle underneath? That never changes.

You do not need to understand everything at once. You just need one good mental model. Then everything else has a place to attach to.

The internet is a restaurant. Your browser is the customer. HTTP is the waiter. The server is the kitchen. You are now the kind of developer who knows what is happening when the page loads — even if the food takes a while to arrive.

Now go open that Network tab and watch the requests fly. It will never look the same again.

Top comments (0)