Networking

• Today we’ll transition from building command-line programs in C to web applications, and though we’ll see new languages, many ideas and concepts will stay the same.
• TCP/IP (Transmission Control Protocol and Internet Protocol) are two protocols, or rules that specify how computers can communicate with each other. The modern internet relies on these protocols to work.
• We might have sent handwritten letters in the mail in the past. On the outside of the envelope, we need to write an address, including information like a name, street, and city. We also write our own name and address as the return address.
• Each address, too, should uniquely identify a building or place.
• Our computers also have addresses that uniquely identify them on the internet, called IP addresses. In IPv4, or version 4 of the protocol, these addresses are numbers in the format #.#.#.#, four numbers between 0 and 255 separated by dots. And to represent each number (with 256 possible values), we need exactly 8 bits, and so each IP address is made of 32 bits. But with 32 bits, we can only represent 4 billion values. And since there are more than 4 billion devices connected to the internet, we have a newer version of the protocol, IPv6, which has 128-bit addresses, that the world is starting to transition to.
• A server, which is just a computer connected to the internet that can listen for and respond to messages, might provide many services, such as a web site or email. To specify that a message is intended for a particular service, such as web browsing, another number called the port number is added to the address. For example, HTTP, for browsing websites, is usually communicated with port 80. So an envelope with a message might have 1.2.3.4:80 as the destination address, and 5.6.7.8 as the return address. And there are other complexities, but that’s the basics of how computers can communicate over a network.
• Let’s say we wanted to visit a URL, Uniform Resource Locator, like http://www.example.com/. It turns out that there’s another technology called DNS, Domain Name System, that many internet providers and organizations maintain, which converts domain names (like example.com) into IP addresses.
  • There are actually now hundreds of TLDs, top-level domains in addition to .com, such as .net, .org, .us, .uk, and more.
  • The www in front of a domain name is actually a subdomain, and there might be many of them created, each of which pointing to a different server or set of servers. It’s not required, and www is only used by convention. For example, MIT uses web.mit.edu for their main website’s address.
  • The / at the end implies that we’re asking for the root page of the site, which is conventionally index.html, where .html indicates that the file is written in HTML, a language we’ll soon look at.
• When we type that URL in a browser, our browser first uses DNS to look up the IP address for that domain, and then sends a request (in a virtual envelope) to the right IP address for the website. And when the server at that address responds, it will send us the content of the website in a virtual envelope with our address as the destination.

HTTP

• HTTP, Hypertext Transfer Protocol, is another set of rules and conventions for communicating. For example, humans might have the convention of shaking hands when meeting for the first (or subsequent) times. When our browser communicates to web servers through HTTP, too, both computers follow a protocol for making requests and responses.

• A request for a webpage will look like this:

  GET / HTTP/1.1
  Host: www.example.com
  ...
  

  • GET is an HTTP verb that indicates we want to fetch some resource. The / indicates we’re looking for the default page, and HTTP/1.1 indicates the version of HTTP our browser is using.
  • Then, Host: www.example.com is included, since the same server might be listening for and responding to requests for multiple websites. There are also other pieces of information included in the ..., to help the server respond to us appropriately.

• The response from the server might look like this:

  HTTP/1.1 200 OK
  Content-Type: text/html
  ...
  

  • First, we get back the version of HTTP, HTTP/1.1. Then, 200 is a numeric code that means OK, that the server was able to understand and respond to the request.
  • Content-Type: text/html indicates that the content of the response is in the language called HTML, in text format.

• We can open a browser like Chrome, and open the Developer Tools with View > Developer > Developer Tools. A panel will open:

  

  • We can click the Network tab, and if we type harvard.edu into the address bar and press enter, a lot will happen very quickly. We can scroll to the very top, click the first request for harvard.edu, and see in the right panel, under “Request Headers”, that the browser indeed sends a request that starts with what we expected:

    

• We can scroll in the same panel and see that the response headers are slightly different:

  

  • The response code, 301, seems to say “Moved Permanently”. And if we look down to “Location:”, we see that the new location is https://www.harvard.edu. There’s a www, and also a different protocol, HTTPS, which will encrypt our communication more securely.

• Another HTTP code, 404, is “Not Found”, and we get that back if we’re trying to get some URL that the server can’t find. These are some interesting ones:

  • 200 OK
  • 301 Moved Permanently
  • 302 Found
  • 304 Not Modified
  • 401 Unauthorized
  • 403 Forbidden
  • 404 Not Found
  • 418 I'm a Teapot
  • 500 Internal Server Error
  • ...

HTML

• Now that our computers can communicate, we can start thinking about creating the content that websites are comprised of.
• HTML, Hypertext Markup Language, is a standard with which webpages are written. It’s interpreted by browsers from top to bottom, and each line might have some text, image, or styling instructions.