DEV Community

Juma Evans
Juma Evans

Posted on

How the Internet Works: From Typing a URL to Seeing a Website

Every day we open a browser, type a website address, and within a few seconds a webpage appears. It feels almost magical, yet behind that simple action is a chain of technologies working together seamlessly.

If you've ever wondered what happens after pressing Enter, this article is for you. We'll follow a single request from your browser all the way to the server and back while explaining the core concepts every backend developer should know.


The Big Picture

Imagine you type:

https://roadmap.sh
Enter fullscreen mode Exit fullscreen mode

into your browser.

Several things happen almost instantly:

  1. Your device connects to the Internet.
  2. The browser asks, "Where is roadmap.sh?"
  3. DNS translates the name into an IP address.
  4. The browser connects to the server.
  5. An HTTP request is sent.
  6. The server responds with HTML, CSS, JavaScript, and other resources.
  7. The browser renders the webpage.

Let's understand each step.


What Is the Internet?

The Internet is simply a massive network of interconnected computers.

Every computer connected to the Internet can communicate with another computer using agreed-upon rules called protocols.

Think of it as an international postal system.

  • Computers are houses.
  • IP addresses are street addresses.
  • Routers are post offices.
  • Packets are letters.
  • Protocols are the rules everyone follows.

Instead of sending one huge file, computers divide information into packets.

Each packet contains:

  • the sender's address
  • the destination address
  • part of the data
  • instructions for reassembling everything

Routers forward these packets until they reach their destination.


What Is an IP Address?

Every device connected to the Internet has an address.

For example:

192.168.1.20
Enter fullscreen mode Exit fullscreen mode

or

172.217.170.110
Enter fullscreen mode Exit fullscreen mode

These are called IP addresses.

Just like your home has a postal address, every computer has an IP address so other computers know where to send information.

There are two common versions:

  • IPv4 (32-bit)
  • IPv6 (128-bit)

Since the number of Internet-connected devices keeps growing, IPv6 was introduced to provide a much larger address space.


Why Don't We Type IP Addresses?

Imagine remembering this every time you wanted to visit GitHub:

140.82.121.3
Enter fullscreen mode Exit fullscreen mode

Instead we use:

github.com
Enter fullscreen mode Exit fullscreen mode

Humans remember names better than numbers.

This is where domain names come in.


What Is a Domain Name?

A domain name is a human-friendly name that points to a server.

Examples include:

  • github.com
  • roadmap.sh
  • google.com

A domain itself doesn't contain a website.

Instead, it's a label that maps to an IP address.

Think of your phone contacts.

You don't remember everyone's phone number.

You save:

Alice
Bob
John
Enter fullscreen mode Exit fullscreen mode

Your phone remembers the numbers.

DNS works in almost exactly the same way.


What Is DNS?

DNS stands for Domain Name System.

It is often called the phonebook of the Internet.

Its job is simple:

Convert a domain name into an IP address.

When you type:

roadmap.sh
Enter fullscreen mode Exit fullscreen mode

your browser doesn't know where that website lives.

It asks DNS:

"Can you tell me the IP address for roadmap.sh?"

DNS replies with something like:

104.xxx.xxx.xxx
Enter fullscreen mode Exit fullscreen mode

Now the browser knows exactly where to send its request.

Without DNS, every website would have to be accessed using an IP address.


How DNS Works

DNS resolution happens in several steps.

1. Browser Cache

The browser first checks whether it already knows the IP address.

If it does, no DNS lookup is needed.


2. Operating System Cache

If the browser doesn't know, your operating system checks its own cache.


3. Recursive Resolver

If the answer still isn't found, the request is sent to your Internet Service Provider (ISP) or another DNS resolver.

Examples include Google's 8.8.8.8 or Cloudflare's 1.1.1.1.


4. Root Name Servers

If necessary, the resolver asks a root DNS server where to continue the search.

The root server doesn't know the final answer but points the resolver in the right direction.


5. Top-Level Domain (TLD) Servers

The resolver then contacts the server responsible for the domain extension.

Examples include:

  • .com
  • .org
  • .net
  • .ke

6. Authoritative Name Server

Finally, the resolver reaches the authoritative DNS server, which stores the actual DNS records for the domain.

It responds with the correct IP address.

The browser caches the result for future requests.


What Is Hosting?

A website has to live somewhere.

That "somewhere" is called hosting.

Hosting is a service that provides servers connected to the Internet so your application is available 24/7.

When you deploy an application, you're copying your code onto a server that other people can reach.

Examples include:

  • a Go API
  • a Node.js application
  • a static HTML website

Hosting providers manage the hardware, networking, storage, and uptime.


What Is HTTP?

Now that we know where the server is, we need a language both the browser and server understand.

That language is HTTP.

HTTP stands for:

HyperText Transfer Protocol

It defines how clients and servers communicate.

The browser sends a request.

The server sends a response.

Simple.


The Client-Server Model

A browser is called the client.

The computer hosting your application is called the server.

Communication looks like this:

Browser
   |
HTTP Request
   |
Server
   |
HTTP Response
   |
Browser
Enter fullscreen mode Exit fullscreen mode

Every website follows this pattern.


Anatomy of an HTTP Request

An HTTP request contains:

  • Request method
  • URL
  • Headers
  • Optional body

Example:

GET /articles HTTP/1.1
Host: example.com
Enter fullscreen mode Exit fullscreen mode

Common methods include:

GET

Retrieve data.

GET /users
Enter fullscreen mode Exit fullscreen mode

POST

Create new data.

POST /users
Enter fullscreen mode Exit fullscreen mode

PUT

Replace existing data.


PATCH

Update part of existing data.


DELETE

Remove data.


HTTP Responses

Servers respond with:

  • Status code
  • Headers
  • Body

Example:

HTTP/1.1 200 OK
Enter fullscreen mode Exit fullscreen mode

Some common status codes are:

  • 200 OK
  • 201 Created
  • 301 Moved Permanently
  • 400 Bad Request
  • 401 Unauthorized
  • 403 Forbidden
  • 404 Not Found
  • 500 Internal Server Error

These codes tell the browser what happened.


What Is HTTPS?

HTTPS is simply HTTP with encryption.

The extra "S" stands for Secure.

HTTPS uses TLS (Transport Layer Security) to encrypt data between the browser and the server.

Without HTTPS, anyone intercepting network traffic could potentially read usernames, passwords, or other sensitive information.

Modern websites should always use HTTPS.


How Browsers Work

Browsers do much more than display text.

Once HTML arrives, the browser:

  1. Parses the HTML.
  2. Builds the Document Object Model (DOM).
  3. Downloads CSS.
  4. Downloads JavaScript.
  5. Builds the CSS Object Model (CSSOM).
  6. Combines them into a render tree.
  7. Calculates layout.
  8. Paints pixels on the screen.

This process happens incredibly quickly, often in just a fraction of a second.


Putting It All Together

Let's revisit what happens when you type:

https://roadmap.sh
Enter fullscreen mode Exit fullscreen mode
  1. Your browser checks its cache.
  2. DNS translates the domain into an IP address.
  3. The browser opens a connection to the server.
  4. HTTPS secures the communication.
  5. An HTTP request is sent.
  6. The server processes the request.
  7. HTML, CSS, JavaScript, and images are returned.
  8. The browser parses and renders the page.
  9. You see the website.

Thousands of lines of code and decades of engineering make those few seconds feel effortless.


Final Thoughts

Understanding networking isn't about memorizing acronyms—it's about understanding the journey of a request.

Once you know how the Internet, DNS, hosting, HTTP, and browsers fit together, backend development becomes much less mysterious. Frameworks and libraries may change over time, but these fundamentals remain the foundation of every web application you build.

The next time you press Enter after typing a URL, you'll know exactly what's happening behind the scenes, from name resolution and secure communication to rendering pixels on your screen.

Understanding these basics is one of the most valuable investments you can make as a software developer because every API, website, and distributed system ultimately builds upon them.

Top comments (0)