📓 How the Web Works: Clients and Servers
You're about to learn your first web framework! But before we begin we'll address several concepts that apply to the internet in general. A series of lessons this section, all prefixed with How the Web Works, will walk through the basic concepts that create the Internet, and allow users to visit sites like those we're about to create. This will provide context to understand how our websites will function, both in our code and behind-the-scenes.
This first lesson will walk through the process by which our computers or devices locate, communicate with, and load websites and other resources.
Internet Protocol (IP) Addresses​
First let's discuss the Internet. When we use the term Internet, we're referring to millions of networks that are connected to allow devices (computers, laptops, phones, etc.) to communicate and access web content.
Similar to the address of your home, devices connected to the Internet have a unique address too. It's called an Internet Protocol Address, or IP Address for short. This address is assigned by an Internet Service Provider (ISP) (e.g. Comcast, CenturyLink, Verizon). Servers for websites also have IP addresses.
IP addresses are represented by four groups of three numbers separated by periods:
198.185.159.145
Sometimes there's an extra number after an IP address, separated from others by a colon : like this:
198.185.159.145:43
This additional number is a port number. A port number is like a home address having an additional mailbox or apartment number appended to the end. It indicates an even more specific location that information travels to at that address.
Requests​
We've covered two addresses so far: Device IP addresses, and website server IP addresses. Next we'll explore how these two addresses interact when we visit a website on an internet-connected device.
To access a website we make a request from a client.
The client is usually a web browser, like Chrome, Firefox, Safari, etc., but can be anything that facilitates our interaction with the web.
A request generally consists of entering a web address in a browser's URL bar, clicking a link, or submitting a form; essentially just anything that triggers us navigating to a new location on the web.
Request Message​
When we create a request, the client constructs a special message. Among other things, this message includes the web address we are sending a request to. (For example, when we click a link to visit this area of the website, the web address https://www.learnhowtoprogram.com/tracks is included.)
This message is formatted using a strict set of rules, or protocol, called Hypertext Transfer Protocol (HTTP) Continuing with the postal mail example, Hypertext Transfer Protocol, HTTP for short, is similar to formatting rules for addressing paper envelopes. We can't write an address anywhere on an envelope, or format it however we please. The postal service outlines distinct protocol for what information is required (street address, city, state, zip), how it's formatted, and where it's written on the envelope. Deviation from this protocol results in letters not reaching their destinations.
HTTP has similar standards. In order for the client to reach its destination, HTTP requires certain information be present and formatted in a specific manner. (Don't worry about how it must be formatted quite yet, we'll explore that in a later lesson on HTTP Requests.)
Locating a Server's IP Address​
After this message is constructed following HTTP protocol, it leaves the client, and the ISP collects that page's corresponding content from the server it resides in.
But before the server can be located, its IP address must be identified using the web address URL provided in the client's request message. This is the job of Domain Naming System (DNS) servers.
There are hundreds of DNS servers that house databases to resolve web addresses to IP addresses. In our example, a DNS server matches https://www.learnhowtoprogram.com/tracks to the IP address 185.199.108.153. Our request message is then sent to that specific IP address, the server containing the Learn How To Program website.
Contacting the Server​
The web server receives the message. Based on its contents, the server determines which resource is being requested or interacted with. For example, a request to view https://www.learnhowtoprogram.com/tracks will gather the resources necessary to display our main Tracks page. This resource is an HTML document. Depending on the specific site and its content, other resources like images, stylesheets, scripts and videos be gathered too.
Responses​
Once this content is collected, a response is sent from the website's server back to the client. This response contains all those resources necessary to load the page. The client interprets this response and the page is displayed in the browser window.
Then, when we interact with the site again by clicking a link or navigating to a different area, the whole process repeats!
This process we've just discussed can also be visualized in the following diagram:
Other Client Types​
One more important note: We're probably most familiar with making web requests through a browser. But any program can actually be a client! For instance, installed programs that automatically check for/downloads updates, apps running on a tablet, even a web server making a request to another web server. They all use the same HTTP protocol!