DEV Community

Cover image for Most Developers Use URLs Daily — But Few Can Explain This
Kathirvel S
Kathirvel S

Posted on

Most Developers Use URLs Daily — But Few Can Explain This

#webdev #web3 #programming #beginners

Ever looked at a URL and thought…

“What the heck are all these slashes, dots, and question marks doing here?”

You’re not alone.

Most developers use URLs every single day — copying them, sharing them, debugging them — but rarely stop to actually break them down and understand each piece.

Stop Copy-Pasting URLs. Start Understanding Them.

So today, let’s fix that.

Grab your coffee and let’s dissect a URL like developers do.

First, What Is a URL?

A URL (Uniform Resource Locator) is basically the address of something on the internet.

Just like your home address helps people find your house, a URL helps your browser find a specific resource on the web.

That resource could be:

  • a webpage
  • an image
  • a file
  • an API endpoint
  • a video
  • literally anything hosted online

Example URL:

https://www.example.com:443/products/item?id=25#reviews
Enter fullscreen mode Exit fullscreen mode

Here’s the Real Example URL 

https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=43s
Enter fullscreen mode Exit fullscreen mode

You’ve definitely seen URLs like this before.

Looks scary?

Relax.

We’re going to slice it piece by piece

1.Protocol (How the Browser Talks to the Server) 

https://
Enter fullscreen mode Exit fullscreen mode

This tells the browser how to communicate with the website.

Common protocols you’ll see:

  • http → normal communication
  • https → secure encrypted communication 🔒
  • ftp → file transfers
  • mailto → send email

In our example:

https://
Enter fullscreen mode Exit fullscreen mode

The S means Secure, which means the connection is encrypted.

That’s why browsers show the 🔒lock icon in the address bar.

Always a good sign.

2.Subdomain 

www
Enter fullscreen mode Exit fullscreen mode

This is a subdomain.

Websites use subdomains to organize different services.

Examples you might recognize:

blog.google.com
mail.google.com
api.github.com
Enter fullscreen mode Exit fullscreen mode

Each one points to a different part of the same company’s infrastructure.

In our example:

www.youtube.com
Enter fullscreen mode Exit fullscreen mode

www is the subdomain.

3.Domain Name 

youtube
Enter fullscreen mode Exit fullscreen mode

This is the main identity of the website.

It’s the name humans remember instead of typing an IP address like:

142.250.190.78
Enter fullscreen mode Exit fullscreen mode

Imagine remembering that every time you want to watch a video.

Yeah… not happening.

So we use domain names instead.

4.Top-Level Domain (TLD) 

.com
Enter fullscreen mode Exit fullscreen mode

The TLD is the ending of the domain name.

Some common ones:

  • .com → commercial sites
  • .org → organizations
  • .edu → educational institutions
  • .net → networks
  • .io → popular with tech startups
  • .dev → developer focused

Country examples:

  • .in → India
  • .uk → United Kingdom
  • .jp → Japan

In our example:

youtube.com
Enter fullscreen mode Exit fullscreen mode

Pretty standard.

5.Port (Usually Hidden) 

:443
Enter fullscreen mode Exit fullscreen mode

Ports are basically doors on a server.

Different services listen on different ports.

Common ones:

Port Usage
80 HTTP
443 HTTPS
21 FTP

The funny thing?

Browsers hide them most of the time.

So this:

https://youtube.com
Enter fullscreen mode Exit fullscreen mode

Actually means:

https://youtube.com:443
Enter fullscreen mode Exit fullscreen mode

Sneaky, right?

6.Path (The Page You Want) 

/watch
Enter fullscreen mode Exit fullscreen mode

The path tells the server which specific page or resource you're requesting.

Think of it like folders on your computer.

Example structure:

website.com/blog/article
Enter fullscreen mode Exit fullscreen mode

In our case:

youtube.com/watch
Enter fullscreen mode Exit fullscreen mode

This tells YouTube:

“Hey, I want to open the video watching page.”

7.Query Parameters (Extra Data for the Server) 

?v=dQw4w9WgXcQ
Enter fullscreen mode Exit fullscreen mode

This part sends extra data to the server.

Structure:

?key=value
Enter fullscreen mode Exit fullscreen mode

In our example:

?v=dQw4w9WgXcQ
Enter fullscreen mode Exit fullscreen mode

v stands for video ID.

So the server reads this as:

“Load the video with ID dQw4w9WgXcQ.”

8.Multiple Query Parameters

Sometimes URLs send more than one piece of information.

That’s when you see the & symbol.

Example from our URL:

&t=43s
Enter fullscreen mode Exit fullscreen mode

Now the full query becomes:

?v=dQw4w9WgXcQ&t=43s
Enter fullscreen mode Exit fullscreen mode

Meaning:

  • v → which video
  • t → start time

So the video starts at 43 seconds.

Pretty neat.

9.Fragment (Jump to a Section) 

#comments
Enter fullscreen mode Exit fullscreen mode

This part doesn’t go to the server.

It’s handled by the browser.

Fragments are used to jump to a specific part of the page.

Example:

example.com/blog#comments
Enter fullscreen mode Exit fullscreen mode

The browser scrolls directly to the comments section.

Super useful for long pages.

Full URL Breakdown

Let’s look at everything together:

https://www.youtube.com/watch?v=dQw4w9WgXcQ&t=43s
Enter fullscreen mode Exit fullscreen mode
Part Meaning
https protocol
www subdomain
youtube domain
.com top level domain
:443 port
/watch path
v=dQw4w9WgXcQ video identifier
t=43s start video at 43 seconds
#comments fragment

Quick Fun Fact

When you press Enter after typing a URL, your browser secretly does a lot of work:

  1. Checks if it already knows the IP address
  2. If not, it asks DNS servers
  3. Connects to the web server
  4. Sends an HTTP request
  5. Server sends back HTML, CSS, JS
  6. Browser renders the page

All of that happens in milliseconds.

Pretty crazy when you think about it.

Final Thought

Next time you see a long messy URL…

Try breaking it down.

You’ll instantly understand:

  • what the website is doing
  • what data is being sent
  • how the page works behind the scenes

And once you start building APIs or debugging requests in DevTools…

This knowledge becomes super useful.

If you're learning web development, mastering small things like this will slowly make the entire web feel less like magic and more like engineering.

Happy coding !

🎁 Bonus: A Fun URL Experiment

Alright, quick challenge.

You just learned how URLs work… so let’s test it with a real one.

Take a look at this URL:

https://www.youtube.com/watch?v=C_ws3EX6DFA
Enter fullscreen mode Exit fullscreen mode

Notice the query parameter:

?v=C_ws3EX6DFA
Enter fullscreen mode Exit fullscreen mode

That’s the video ID YouTube uses to load a specific video.

Now here’s the fun part.

👇 Click it and see what happens.

https://www.youtube.com/watch?v=C_ws3EX6DFA

If you clicked it…

Congratulations.

You just got professionally Rickrolled by a URL tutorial.

And now you’ll probably never forget what a query parameter does.

Learning + internet culture = perfect combo.

Top comments (0)