(This is a summary of week 8 from the Harvard CS 50x series. Visit this page to see more from this series! )
This week’s topic was HTML, CSS, and JavaScript — one that I’m quite familiar with, as I use it on a daily basis for work. Every day I learn more about it and discover new things that we can use it for!
Fun fact: I was born the same year as JavaScript!
One of the talks I watched this week during the Women in Technology Online Festival 2020 was by Tania Asimionesei - “Javascript is here to stay: from ‘silly little brother’ to industry disruptor”.
It definitely reminded me of all the cool things we can build with JavaScript and also how quickly it has developed over the past 2 (almost 3) decades. How inspiring!
Speaking of which, I want to say a big thank you to Goldman Sachs for gifting me with the second prize of $100 AWS Giftcard and 3-months access to Pluralsight for completing their challenge and cracking the code! 👩🏻💻
I’m thinking something related to python/machine-learning to build on top of the skills that I’ve learnt from this CS50 course!
Do you have any ideas? Share them in the comments below!
Summary
- Web development
- The internet → network of networks
- Routers relay our data from us to servers and vice versa
- There are many paths that data can take via routers
- Protocols standardise what the message going back and forth are
- Packets of information
- Two of the most common protocols:
TCP/IP
TCP: Transmission Control Protocol → Allows a server to do several services, handles adaptive delivery of packets, the process of re-transmitting data if required
Even if we send several packets from the same computer to another, it might take different routes
IP: Internet Protocol → Standardises how computers address each other by using IP addresses
Two sets of conventions that computers use to get data from one point to another - Our computers generally know where the closest routers around us are, and these routers help our messages get to the right IP addresses
- DNS: Domain Name System → Is a technology that converts certain domain names such as “www.google.com” to numeric IP addresses
- Port number → a number that represents certain services (e.g. 80 HTTP, 443 HTTPS)
- Anytime a computer is trying to transmit a decent amount of data, for equity sake, it tends to be good for computers to chop up large packets into multiple smaller packets (Net neutrality)
- Sequence number to packets → e.g. 1 of 2, 2 of 2 (just in case a packet gets lost/dropped)
- HTTP: HyperText Transfer Protocol → Governs what is inside the packets of information for web servers + web browsers
- HTTPS means the content of the packet is encrypted so that only the sender and recipient can understand it
- HTTP request + responses
- Status codes
- DevTools
- Cache
- curl → command-line interface to send requests and it returns a response
- URL parameters (e.g. ?q=cats)
- HTML:
open and close tags
attributes
parent + children
lists (ordered + unordered)
table
image
links <a href>
— potential phishing threats
search
— forms - HTML builds a tree-like data structure and store it memory → DOM tree
- Servers allow us to host webpages
- Ports
- CSS properties
- JavaScript:
querySelector
event listeners - IoT devices and how we can send requests to control them
- JSON
Thoughts
- I enjoyed the familiarity of learning about what I use at work, but I was already quite familiar with the basics of HTML, CSS and JavaScript
- Nothing in particular that I wasn’t aware of - but it was quite nice to know this, as it was quite reassuring (oh the joys of having Imposter Syndrome… 😅)
Links to Assignments
For this week’s assignment, we were asked to complete Problem Set 8.
