If you're an aspiring web developer, you may have wondered what websites are made up of and how they get to your computer.
It's pretty neat stuff, and building an understanding of it will help you lay a strong foundation as you embark on your web development journey.
This post assumes no prior knowledge of web development.
In it, I'll cover:
- How computers represent websites
- What a server is
- How computers find each other on the internet
What is a website, really?
At the end of the day, a website is a bunch of files that web browsers know how to read. The files contain instructions for the browser that describe what should be displayed to the user.
We'll leave an in-depth discussion of them for another day – but here's the quick low-down:
- HTML sets the structure of a web page. It's the skeleton of the page.
- CSS controls the style of the page. (things like fonts and colors)
Your browser knows how to read all three of these and determine what should be displayed.
At the end of the day, a website is just a bunch of files that web browsers know how to read.
When you type google.com into your browser, you're basically saying, "Hey Internet, please give me the the files for google.com." Once it receive those files, your browser can read them to figure out what to show you.
Where do those files live?
For your computer to be able to get them, the files have to be stored somewhere. In fact, they have to be stored on another computer.
The computer that stores the files is also responsible for sending you the files. Another name for sending files is serving them, so we call this computer a server.
The files are sent over the Internet, so it's important that both your computer and the server be connected to the web. (note that "the web" and "the Internet" are just two names for the same thing)
How do computers communicate?
How do computers send things to each other on the Internet? How do we know that the contents of our message – whether it's a request for files or the files themselves – will make it to the right place?
The answer is: addresses.
In the physical world, we have physical addresses. If I want to send you a letter, I can write your address on an envelope. Addresses come in handy on the Internet as well. Computers have addresses which they use to communicate with each other.
But addresses only work if everybody agrees to use the same system. I don't recommend putting latitude and longitude coordinates on your wedding invitations. You may not have many guests show up.
Addresses work because we're all using the same agreed-upon system. We call this kind of agreed-upon system a protocol.
On the Internet, the protocol for addresses is called the Internet Protocol. To send someone a message, you need to know their Internet Protocol address – or IP address for short. (Or just IP, if you're feeling really hip)
Addresses only work if everybody agrees to use the same system.
So, in order to ask for the files that make up google.com, you need to know the IP address of the server for google.com. Once you know that IP, you can talk directly to that server and request the files from it.
How do we get an IP from a URL?
Remember earlier when I said that typing "google.com" into your browser was like asking the Internet for those files? Well, I kind of lied to you.
What you're really doing there is asking the Internet: "Hey, Internet, what's the IP address for the google.com server?"
And, again: once you get that IP address, you can directly request the files from that server.
But how does the Internet know the IP address for google.com?
Basically, there's a giant directory of URLs and IP addresses. For every website on the Internet, it can tell you the IP address of the corresponding server. This directory system is called the Domain Name System, or DNS for short.
We could spend a long time talking about how DNS works, but we'll save it for another time. For now, just remember that it tells you the IP address for a particular website's server.
Once you get that IP address, you can directly request the files from that server.
Just like with physical mail, return addresses come in handy.
In its request to the google.com server, your computer will include its own IP address. That way the server know where to send the files.
Once your computer receives them, your browser can read the files to figure out what it should display to you.
You're on the journey!
I hope you enjoyed this quick intro to what websites are and how they get onto your screen.
I was well into my programming journey before I learned how this all works, and I wish someone had given me an overview when I was first learning to code. These concepts are an important foundation for anyone looking to start a career as a web developer.
Let's level up together!
If you're into this kind of content, make sure to subscribe!
Since I'm just getting started with this blog, I'm able to build a personal connection with each one of my subscribers.
If you'd like to join the community, I'd love to have you. 🙂
Check this out as a podcast
If you liked this post, you should check out the discussion my friend Robbe and I had on our podcast, The (De)coders. We discussed this exact topic, and I think you'll enjoy it.