Skip to content

Web Basics

Frank Matranga edited this page Jan 8, 2020 · 6 revisions

Understanding how the Web works is important, though not required, to be a good web developer.

What happens when I type www.github.com into the URL bar and hit enter? How does the browser get the website? How does it display the website and all of its content?

Clients and Servers

Most interactions on the web take place between clients and servers. A good analogy is that of a restaurant, where the customer is the client and the server is the waiter. The customer requests items from the waiter and after a time receives a response, hopefully the requested items. However, the customer might make mistakes in their order by ordering something not on the menu, or the restaurant might be out of the requested items. Either way, the waiter will receive the request, process it by having the items made or finding the issue, and return with the reply to the customer. The customer must make requests in order to receive a reply. For example, the waiter will not know if you need extra straws unless you ask for them.

This is similar to how clients and servers on the web work. Servers are programs running on a computer that sit and wait for requests from clients who want to be served a reply. The requests have standardized forms and can ask for many different things. Different servers will choose to accept or deny different requests and will reply in different ways. Commonly, the client will request a webpage. The server will see if it exists, and reply with it if it does. If it does not, it replies with the error, specified by a particular code. You have probably heard of the Not Found code, 404! Others signify a successful request, an internal server error, a block of access, etc. See this MDN article for more detail. Google 404 Page


Your browser is the client. When you type in the URL of a website, the browser makes a request for the specified webpage on the website and displays the reply, commonly known as the response. If there are images on the webpage, when the page loads the browser will recognize them and make requests for the images one-by-one. This is why you might see a webpage load, and then see images appear. Once the content of a page is loaded, the browser sends requests for all the other types of resources the page needs: images, videos, audio, CSS (we'll get to that), and Javascript code.

Let's look at this page itself as an example. We can use Google Chrome's Developer Tools to see exactly what requests the browser makes and we can inspect the replies. Open the Dev Tools with F12 or Ctrl-Shift-I. Switch to the Network tab. Refresh this page. You will see something like this: Network requests

Sources: