How the web works
Before you can understand web coding and development, you need to take a step back and understand a bit about how the web itself works. In particular, you need to know what happens behind the scenes when you click a link or type a web page address into your browser. Fortunately, you don’t need to be a network engineer to understand this stuff, because the basics can be explained without much in the way of jargon. Here’s a high-level blow-by-blow of what happens:- You tell the web browser the web page you want to visit.
You do that either by clicking a link to the page or by typing the location — known as the uniform resource locator or URL (usually pronounced “you-are-ell,” but also sometimes “earl”) — into the browser’s address bar.
One way to get to a web page is to type the URL in the browser’s address bar. - The browser decodes the URL.
Decoding the URL means two things: First, it checks the prefix of the URL to see what type of resource you’re requesting; this is usually http:// or https://, both of which indicate that the resource is a web page. Second, it gets the URL's domain name — the something.com or whatever.org part — and asks the domain name system (DNS) to translate this into a unique location — called the IP (Internet Protocol) address — for the web server that hosts the page.
The browser extracts the prefix, domain, and the server address from the URL. - The browser contacts the web server and requests the web page.
With the web server's unique IP address in hand, the web browser sets up a communications channel with the server and then uses that channel to send along a request for the web page.
The browser asks the web server for the web page. - The web server decodes the page request.
Decoding the page request involves a number of steps. First, if the web server is shared between multiple user accounts, the server begins by locating the user account that owns the requested page. The server then uses the page address to find the directory that holds the page and the file in which the page code is stored.
The server uses the page request to get the account, directory, and filename. - The web server sends the web page file to the web browser.
The web server sends the requested web page file to the browser. - The web browser decodes the web page file.
Decoding the page file means looking for text to display, instructions on how to display that text, and other resources required by the page, such as images and fonts.
The web browser scours the page file to see if it needs anything else from the server. - If the web page requires more resources, the web browser asks the server to pass along those resources.
The web browser goes back to the server to ask for the other data needed to display the web page. - For each of the requested resources, the web server locates the associated file and sends it to the browser.
The web server sends the browser the rest of the requested files. - The web browser gathers up all the text, images, and other resources and displays the page in all its digital splendor in the browser’s content window.
At long last, the web browser displays the web page.
How the web works, take two
Another way to look at this process is to think of the web as a giant mall or shopping center, where each website is a storefront in that mall. When you request a web page from a particular site, the browser takes you into that site’s store and asks the clerk for the web page. The clerk goes into the back of the store, locates the page, and hands it to the browser. The browser checks the page and asks for any other needed files, which the clerk retrieves from the back. This process is repeated until the browser has everything it needs, and it then puts all the page pieces together for you, right there in the front of the store.This metaphor might seem a bit silly, but it serves to introduce yet another metaphor, which itself illustrates one of the most important concepts in web development. In the same way that our website store has a front and a back, so, too, is web development separated into a front end and a back end:
- Front end: That part of the web page that the web browser displays in the browser window. That is, it’s the page stuff you see and interact with.
- Back end: That part of the web page that resides on the web server. That is, it’s the page stuff that the server gathers based on the requests it receives from the browser.
However, as a maker of web pages — that is, as a web developer — your job entails dealing with both the front end and the back end. Moreover, that job includes coding what others see on the front end, coding how the server gathers its data on the back end, and coding the intermediate tasks that tie the two together.