This article is a crash course on some of the basics regarding the internet and how it works.

Intro

It’s important to understand that the internet is just a bunch of computers and devices connected to each other with wires. Each of these devices have a unique identifier called an IP address. This address is essentially the address that lets other computers/devices know where to find them.

DNS

When an internet browser (eg. Chrome) retrieves a web page for viewing, this is the general process that happens with most modern websites:

  1. Type in yourwebsite.com into browser and press Enter.
  2. The browser (or client) goes to a Domain Name Server (DNS) to ask where yourwebsite.com resides.
  3. The DNS looks through its records and finds that yourwebsite.com should go to a computer with an IP address of 12.123.12.12
  4. The client then tries to connect to this IP address to retrieve content.

The IP Address in this case usually leads to a server that is able to direct the client’s request to the correct areas. It can be the actual server that hosts the website content, or it could be a “load balancer”. A load balancer is a server that directs the user to another server that can provide the content. This is usually done so that one server doesn’t have to handle all the request and get overwhelmed. 

Below is a diagram illustrating this:

Rendering

After the content is retrieved and is available for viewing, the internet browser will render this content to be human readable. There are 3 main elements to this that help render content:

  • HTML: This is the markup language that tells the browser how to structure the content. For example, the below will ask the browser to render a paragraph that says “Hello World”:
Hello World
  • CSS: This is a stylesheet that describes how the page should be styled. For example, the below will ask the browser to make all paragraphs (text inside the tags) red:
p { color: red; }
  • JavaScript: This is the code that makes some of the elements on the page more interactive. For example, JavaScript can tell the browser to change the font color once a page has been clicked. JavaScript accomplishes a lot more for modern websites, but for our purposes, understanding that it handles how elements behave is sufficient.

Navigation

You don’t have to read these in order, but the next article is here.