CS50 Week 8: HTML, CSS, JavaScript

What is the Internet and how does it work?

Written by Eva Dee on (about a 4 minute read).

The Internet

  • a network of networks of computers communicating (i.e., transferring data) with one another
  • Routers: specialized computers with CPUs and memory, whose purpose is to relay data across cables or wireless technologies, between other devices on the internet.
  • Protocols are a set of standard conventions that the world has agreed upon for computers to communicate with.

TCP/IP

  • TCP/IP are two protocols for sending data (packets) between two computers
  • IP stands for internet protocol that dictates the standard way for computers to address each other.
  • IP addresses are unique addresses for computers connected to the internet
  • Routers have, in their memory, a table mapping IP addresses to cables each connected to other routers, so they know where to forward packets to.
  • DNS, domain name system translates domain names to IP addresses. DNS is generally provided as a service by the nearest internet service provider, or ISP.
  • TCP, transmission control protocol, allows a single server, at the same IP address, to provide multiple services through the use of a port number (e.g., 80 for HTTP, 442 for HTTPS)
  • TCP also provides a mechanism for resending packets if a packet is somehow lost and not received.
  • A large amount of data, such as a picture, will be broken into smaller chunks so that the packets are all of a similar size (they also have to be numbered, e.g.,: 1/2, 2/2).
  • Net neutrality refers to the idea that these public routers treat packets equally, as opposed to allowing packets from certain companies or of certain types to be prioritized.

HTTP

  • the web is just one of the services that run on top of the internet
  • HTTP commands: GET allows a browser to ask for a page or file, and POST allows a browser to send data to the server
  • a url, or web address, consists of: the protocol (https with encrypted content of the packets) + domain name (google.com) + hostname (www aka world wide web and not a mail or chat server) + / requesting the default file (index.html)
  • .com is known as TLD or top-level domain

HTML

  • tells the browser what to display and how (via tags and attributes)
  • start a simple server with http-server

CSS

  • styling via properties and selectors

JavaScript

  • allows you to write code that is saved on the server but runs in the user's browser (aka client-side)

Instead of event.preventDefault() return false 🤔

  	<body>
        <form onsubmit="greet(); return false;">
            <input id="name" type="text">
            <input type="submit">
        </form>
    </body>

Wait for the dom to be loaded before proceeding with JS (instead of moving the <script> tag all the way down).

   document.addEventListener('DOMContentLoaded', function() {
        document.querySelector('form').addEventListener('submit', function() {
            let name = document.querySelector('#name').value;
            alert('hello, ' + name);
        });
    });
  • 💡the js anonymous function corresponds to python's lambda