How the Internet Works
Before going into the specifics of coding a website, it is imperative that we first understand the overarching framework within which we are going to be making our websites: the internet. Consider this question: what happens when you open up your browser and type in "www.google.com"?
URLs, Clients, and Servers
You've probably heard of people talking about "clients" and "servers." In the context of opening up Google's homepage, our laptop (more specifically, our browser) is the client and a Google computer somewhere in Oregon is the server. Somewhere on Google's server, there is information on what google.com looks like which our browser needs to retrieve. Imagine that Google's server is just another computer that is waiting around for a client to request google.com so that it can send the client the webpage.
(This will be our working representation of us trying to access google.com)
In order to retrieve the webpage from Google's server, we need to make a request to the specific server by telling our network which computer to go to. Every computer in the world has a unique identifier known as it's IP address. An IP address is a number, often in the form of 123.123.123.123, which uniquely identifies every single computer on the internet. For instance, if you go to Google and type in "my IP", Google will magically tell you the IP address of your own computer. In order to tell the network to make a request to google's server, we need to know what the IP address of Google's server is.
It turns out that humans are pretty bad at remember things longer than 7, much less the 12 digits that make up an IP. Also, how annoying would it be if every time you wanted to go to a website you had to sit and type 12 numbers. To solve all of these issues, we invented URLs. A URL, or Unique Resource Locator, is an alias for the IP address of the server that it represents. For instance, "www.google.com" is a URL. So is "www.google.com/images". In later chapters, we'll talk about how a URL is made up of two parts: (1) the domain "www.google.com" and (2) the file path "/images" (everything that comes after the domain).
So now, when we go to our browser and type in "www.google.com," we know that it is telling the network to go make a request to google's server.
(Typing google.com into your browser tells the network which IP address you are looking for which then goes and makes a request to the computer represented by that IP)
Static Files Make a Webpage
Great! We've successfully contacted the mysterious Google server. Now what?
Google's server was built for this moment. It was patiently waiting for someone to ask it for Google's homepage and now is it's time to shine. It has to send us (the client) back the information necessary to display the google homepage on our web browser. It does this by sending us the static files that represent the webpage.
Static files come in three types: HTML, CSS, and Javascript. Our browser uses files as a blueprint to render a given webpage. We'll go into each of these file-types in more detail later on in the book, but here is a quick primer:
- HTML: Represents the structure and content (words/images) on the page. Think of this as the page's bare-bone skeleton.
- CSS: This tells the browser how to style the page. Think of this as the skin and features of a human that turns a skeleton into a human.
- Javascript: This tells the browser how the different elements on the page respond when the user interacts with them. It gives our human life, allowing it to move around, react to its surrounding, etc.
Thus, when Google's server gets our request for Google's homepage, it quickly serves up the static files for Google's homepage and sends them back to our computer.
(Here we see that after receiving the request, the Google server sends back the static files)
Accessing Other Pages on a Website with the File Path
Being able to get google.com is wonderful. But sometimes we want to go to other pages within google.com. For instance, we might want to open up Google Maps at "www.google.com/maps". When we type that into our browser, the network interprets this in the two parts we mentioned before: (1) the domain "www.google.com" and (2) the file path "/maps".
Our browser uses the domain to identify the IP address of the server. It then uses the file path as a message of what exactly we are requesting. When we type just "www.google.com", the file path is implicitly "/", which often means the homepage.
In the case of our maps example, our file path is "/maps". The server uses the file path to determine what static files to send back to the client. So, when we go to www.google.com/maps, Google's Server is going to serve us the HTML, CSS, and Javascript necessary to render Google Maps in our browser.
Conclusion
To summarize, internet websites are essentially servers (or computers) sitting around waiting for clients (like our laptop browser) to request access to a page. We access a specific website server by typing in a URL, made up of a domain and a file path. The domain indicates the IP address of the server we want to access and the file path tells the server what page we want to access to. When the server receives a request from the client, it sends back static files in the form of HTML, CSS, and JS that represent the request webpage. The client then receives the static files and uses them to render the webpage in the browser.
Now that we have a general idea about what the internet is and how it works, let's take a look at what Django is!