CS50 — Week One Notes

CS50 — Week One Notes

From Scratch to C.

  • same elements, different language to implement
  • write a bit of code, run/test it, then move on once its debugged (vs trying to write all your code at once and then not really knowing which part is making the whole thing crash, etc.)
  • any time I’m copying and pasting code from one place to another without changing a thing, there’s probably a better way to do it (a cleaner design)
  • source code –> pass as input to a compiler –> compiler turns it into source code that computer can read
    • “compiling” = umbrella term
    • preprocessing
      • find and (re)place
      • ex. “#include”s in C are in this step
    • compiling
      • source code –> assembly code
      • assembly code = arcanely worded sets of instructions that sets of 0s and 1s are mapped to
    • assembling
      • assembly code –> 0s and 1s
    • linking
      • computer gets the 0s and 1s from the code I wrote in my .c file, CS50 staff’s 0s and 1s from what they wrote in the CS50 library, printf()’s 0s and 1s from the standard input/output library, etc. (whatever was used to write my program) and combines together in my program “hello” (or w/e the name is)

The imprecision of number representation due to a computer’s limitations

  • we humans can think of and create an infinite number of numbers
  • computers are limited by how much memory’s available in their RAM
    • think about it – without any tricks or extra code, a byte can only store integers of value 0 thru 255!
  • we humans need to be aware of this limitation
    • ex: when The Patriot anti-air missile system was programmed to count time by 1/3 of a second, and so after running for many hours straight its timing was off and lives were lost
  • by creating a simple program in C, we can see that the computer’s representation of the decimal created by dividing 1 from 10 (should be 0.10) proves itself to be fundamentally imprecise when taken to too many decimal points
    • printf(“n is %.55f”, 1.0 / 10.0); yields “n is 0.1000000000000000055511151231257827021181583404541015625”

The Linux Command Line

  • Mac OS is a descendent of the Unix operating system (“a Unix-based system”); Linux was developed independently but is similar to Unix; Windows was built from ground up in a completely different way
  • the default command line in the CS50 IDE is terminal called “workspace”
  • shell = software interface (often a command line interface) that allows users to interact with the computer
  • bash = “Bourne-Again Shell”, the default shell environment in Linux and Mac OS X

name of command <argument>


  • short for “list”, gives readout of all files and folders in current directory
    • blue = directory (that I can navigate into)
    • black = text or source code file
    • green = executable file

cd <directory>

  • short for “change directory”, changes current directory to (a specified)<directory> in my workspace or on my operating system
    • shorthand for current directory = .
    • shorthand for parent directory of current directory = . .
    • pwd (present working directory) gives name of current directory
    • cd on its own will bring me back to original directory location
  • if the name of a directory has multiple words separated by spaces, must enclose name in quotes when calling it up

mkdir <directory>

  • short for “make directory”, creates a new subdirectory called <directory> located in the current directory
  • analogous to: in GUI operating system, right click and in prompt click “New Folder”

cp <source> <destination>

  • short for “copy”, creates duplicate of file I specify as <source>, which it saves in <destination>
  • cp -r <source directory> <destination directory>
    • copies entire directories (“-r” flag stands for recursive, tells cp to copy everything inside directory, including any subdirectories it may contain)

rm <file>

  • short for “remove”, deletes <file> after asking me to confirm (y/n)
  • rm -f <file>
    • skips the confirmation (but can’t undo so beware)
  • rm -r <directory>
    • deletes entire directory (can combine with -f flag: “rm -rf <directory>”)

mv <source> <destination>

  • short for “move”, renames file, moving it from <source> to <destination>

chmod <options> <permissions> <file>

  • short for “change mode”, changes the permissions of files or directories (aka who can access the file and how they can access it)
  • options are like the -f flag we saw before, plus others
  • permissions can be defined for:
    • user (owner of file)
    • group (members who own the file with you)
    • others (anyone else)
  • permissions can include:
    • read (4), write (2), execute (1), no permission (0)
  • example in symbolic permissions notation:

    chmod u=rwx, g=rx, o=r myfile

  • same example in octal permissions notation:

    chmod 754 myfile

ln <target> <linkname>

  • short for “link”, creates links between files
  • if <linkname> is omitted, link to <target> is created in current directory using the name of <target>
  • different from cp – same data is being pointed to by both file names
    • if go into data and change it from either, the data is changed for both
    • if one of the files is deleted, data is still safe in other file which points to it
  • use the tag -s to create symbolic links (file points to other file/directory where data/files are stored)

touch <file>

  • changes file timestamps (access, modification times) to current system time

rmdir <directory>

  • short for “remove directory”, removes directories that are empty

man <argument>

  • short for “manual”, shows the system’s reference manual for that argument (usually a program, utility or function)

diff <file> <file>

  • short for “different”, analyzes two files and outputs instructions to change 1st file to match the second

sudo <command>

  • short for “superuser do”, allows a permitted user to execute command as another user


  • clears the screen
  • same as ctrl + l in bash


  • short for “TELNET protocol”, used for communication with a remote host or device
    • ex: “telnet hostname” would connect user to a host named hostname
    • unsafe to transfer data in this way because others could grab data as it’s being transmitted

Data Types

  • in C, an older language, we have to specify each data type before we can work with it

Native to C:


  • used for variables that will store integers
  • integers always take up 4 bytes (32 bits) of memory
    • roughly, that means we can store -2 billion to 2 billion
  • unsigned int
    • unsigned = qualifier that doubles positive range at the expense of disallowing negative values
      • other qualifiers = long, short, const
    • if I know my value will never be negative, I can use this to count up to ~4 billion


  • used for variables that will store single characters
  • characters always take up 1 byte (8 bits) of memory
    • thanks to the ASCII system, different numbers have been assigned to characters (ex: “0” = 48)


  • used for variables that will store floating-point values (real numbers)
  • floating point values always take up 4 bytes (32 bits) of memory
    • some of these bits are used for the integer part and some for the decimal portion
    • we are limited to how precise we can be


  • used for variables that store floating-point values
  • double precision -> always take up 8 bytes (64 bits) of memory


  • a type, but not a data type (can’t assign a value to it)
  • void functions don’t return a value
  • a function’s parameter list can also be void if the function takes no parameters
    • like “main”, when we haven’t been passing any arguments into main (we could tho)

Thanks to the CS50 Library:


  • used for variables that store a Boolean value (true or false)
  • booleans are a standard default (native) data type in many modern programming languages, but not in C


  • used for variables that will store a series of characters (a “string”)
  • can be words, sentences, paragraphs or even books!
  • not a native data type in C, so doesn’t come up as purple in the IDE

And later on…


  • used to group ints and strings into one unit


  • “defined types” that allow me to create my own data types


  • to create (“declare”), specify the data type, give it a name, and slap a semicolon to the end
  • to create multiple variables of same type, specify the type once and then list as many variables as desired
    • int height, width;
      • creates two integer type variables with respective names “height” and “width”
  • good practice = create variable right when I need it
  • after a variable’s been declared, no need to specify variable type again
  • simultaneously declaring and setting the value of a variable? (“initializing”)
    • int price = 17; // we’ve specified an integer, named the variable “price” and assigned it a value of 17


  • in C, we can add, subtract, multiply and divide numbers, as well as get the remainder of left number divided by right (modulus)
    • int m = 13 % 4; // m is now 1 (13 / 4 = 3.25 or 3 1/4)
    • the modulus operator is more useful than you’d think (like in a random number generator, whereby you want to limit the range of the random number you generate)
  • shorthands
    • x = x * 5 –> x *= 5; // works with all 5 basic operators
    • x++; // incrementing variable by 1
    • x–; // decrementing variable by 1
      • x = x + 1 == x += 1 == x++

boolean expressions

  • in C, every nonzero value = true and every zero = false
  • don’t always have to use type bool when we are working with boolean expressions
  • logical operators
    • logical AND (&&) is true if and only if both operands are true, otherwise false
      • if x && y {..go down this path..}
      • x is true and y is true? true
      • x is true but y is false? false …etc.
    • logical OR (||) is true if and only if at least one operand is true, otherwise false
      • if x || y {…}
    • logical NOT (!) inverts the value of its operand (called “bang”, “exclamation” and “not”)
      • x is true? !x is false (and vice versa)
  • relational operators
    • less than (x < y)
    • less than or equal to (x <= y)
    • greater than (x > y)
    • greater than or equal to (x >= y)
    • equality (x == y)
    • inequality (x != y)


let’s learn JavaScript! (or melt my brain trying) – Day One

let’s learn JavaScript! (or melt my brain trying) – Day One

JavaScript syntax

  • statements (instructions executed by web browser) separated by semicolons
  • fixed values = literals
    • numbers (with or without decimals)
    • strings (text written within double or single quotes)
  • variable values = variables
    • used to store data values
    • keyword “var” used to declare them
    • assign values to variables with “=”
    • compute values with arithmetic operators (+ – * /)
  • expression = combo of values, variables and operators
    • computes to a value
    • the computation is called an evaluation
    • i.e. 6 * 10 evaluates to 60
    • values can be numbers and strings
      • “John” + ” ” + “Sausage” evaluates to “John Sausage” (string linking called concatenation)
  • keywords identify actions to be performed
    • ex. “var” tells the browser to create variables
  • identifiers = names JavaScript accepts
    • used to name variables, keywords, functions and labels
    • rules:
      • first character = a letter, underscore or dollar sign (no #s!)
      • subsequent characters = letters, digits, underscores or dollar signs
      • case sensitive (i.e. var lastName != var lastname; “VAR” is not interpreted as the keyword “var”)
      • no hyphens (reserved for subtraction operations)
    • programmers in JS tend towards “lower camel case” – camel case that starts with a lowercase letter: lastName, classicJazz, hippoFinger


  • statements are executed in the order they are written (top to bottom, left to right)
  • ending statements with semicolons = not required, just highly recommended
  • white space is ignored by browser when reading your instructions, but using it can increase readability
    • i.e. good practice = put spaces around operators
    • statement doesn’t fit on one line? break after an operator or comma
  • statements can be grouped in code blocks inside curly brackets
    • purpose = define statements that are to be executed together
    • ex: functions
  • often start with a keyword to identify what action is to be performed
    keyword description
    break terminates a switch or loop
    continue jumps out of loop and starts at top
    debugger stops execution of scripts, calls (if available) debugging function
    do … while executes a block of statements & repeats the block, while the condition is true
    for marks a block of statements to be executed, as long as condition is true
    function declares a function
    if … else marks a block of statements to be executed, depending on a condition
    return exits a function
    switch marks a block of statements to be executed, depending on different cases
    try … catch implements error handling to a block of statements
    var declares a variable
  • keywords are reserved words!! (cannot be used as names for variables)


  • used to hold data (data types in JS include numbers & strings)
    • strings = written inside double or single quotes
    • numbers = no quotes (if written in quotes, will be treated as string)
  • similar to algebra, variables are used in expressions (i.e. total = price1 + price2, where “total”, “price1” & “price2” are defined variables)
  • must be identified with unique names (“identifiers”)
  • use the “assignment” operator when declaring variables (=)
    • not to be confused with the “equal to” operator (==)
    • ex: x = x + 5 assigns the value of x + 5 to x
    • good practice = declare all variables at beginning of a script
      • can declare many variables in one statement by using commas
        • var person = “Baby Thumb”, carName = “Wristmobile”, price = “priceless”
  • a variable can be declared without a value (in that case, the value is “undefined“)
    • can be useful if value is something that needs to be calculated or provided later, like user input
    • after the execution of this statement, the variable carName will have its value undefined: var carName; ((if nothing else is added, will show up as ‘undefined’ within page))
  • can re-declare a variable without it losing its previously assigned value
    • var carName = “Wristmobile”; var carName;
  • if declare with a number in quotes, rest of numbers following will be treated as strings and concatenated (added)
    • var x = “5” + 2 + 3 (value will show as “523”)
    • var x = 5 + 2 + “3” (value will show as “73”)

Today’s Resources:

The ever-helpful W3School’s JavaScript tutorial.

basics of higher-level software programming languages

basics of higher-level software programming languages


Computers are linear – they are reading top to bottom, left to right. If you want to make two things happen at once, you are creating the illusion that the computer is doing this. (But it’s not, it’s doing one thing at a time still.)

Everything’s possible with programming, but it takes some cleverness to accomplish it.

Everything has a position – the file, the program, etc.

Frames: everything you want to have happen “at the same time” has to happen within the same frame – calculate a little, show a little, calculate a little, show a little.

Anything that happens first tells the computer what’s coming next. (For example, in CSS the “.” before “.thick-outline” tells me that it’s going to be read by the computer as a class, and not something else.)

Always think about everything possible that people could do. If you have some data they can input, think about all the different data they could give you, even outside your expectations (hackers use data exceptions to break programs, for example).

If you ask the computer, what data is in that position, and that position does not exist, it’ll be “null”.

Array = database without a pointer, instead it just has numerical names to identify the location of various elements. (No “next line”, just “data piece 4” or “data piece 7”.)

Native data types = what’s already there. If it’s not a native data type (like strings in C), it’s going to take an extra cleverness to make it work.

Because the computer reads left to right, there’s precedence. Whatever comes first sets the stage. For example, it quotes tell the computer there’s text coming, and then I type “//”, this will be shown as text and not create a comment.

In C, “;” is not needed at the end of pre-processor directives (#blah input library blah), comments, function definitions, and controllers.

In C, you must start with the function “main” (like how you have to put everything you want the user to see inside the <body> tag in HTML).

4 basics:


  2. data

  3. functions

  4. variables/names


  • text not read by the compiler or the interpreter
  • // – line comment (end comment by going to new line)
  • /* – block comment (end with */)
  • for me, for other people looking at my code, and for remembering things that for the moment aren’t visible (I create some variable but what am I using it for? etc.)


  • number types
    • boolean
      • 0 or 1 – one binary digit
      • for example: “true” returns a boolean 1
      • use it every time you can
    • integers (C: “int”)
      • shorts, longs
      • if you can stick with integers, do! otherwise it’s a big mess
    • floating points/floats
      • decimals are infinite! (and therefore can get very messy)
  • character types (C: “char”)
    • strings = a string of characters/a blip of text
      • in C, there’s support for how you can make your own strings, but it’s not it’s own type like it is in C++
        • one way: make an array of letters
        • a bunch of things stored in your memory, accessed thru pointers telling your computer where in the memory to look for that piece of data
        • can use functions like “printf”
  • pointer types
    • every type of data is really just a position on the memory that your computer is accessing
    • the computer does not hold anything in its hands – it goes line by line and accesses the memory
    • even RAM is used in the same way, where the computer has to call it up from memory to access it, but it’s just a smaller amount and therefore easier/faster for the computer to get through it
    • pointers tell the computer where to look in the memory


  • basic, native functions
    • aka the actual building blocks
      • examples: +, int, return, true, const char, etc. (everything pink in Xcode)
      • “int” locates, sets up memory space that’s the right size to store integers
  • library/included functions
    • a group of other people’s functions (built off native functions)
    • problem could be that I don’t know how it works, since someone else made it
      • documentation (description, examples, source code) or testing can help
  • custom functions
    • my own (also built off native functions)
  • functions work with data
    • functions that work with integers only, for example
  • 3 things functions do:
    • input data into the function from the code (either actual user input I type in and can see or from variables I’ve set up with some stored memory of some data) = parameters
      • a function can have no parameters, many (a lot of things to input), etc.
    • output data into the code = return
      • for example, if I am using the function “+” and I input the data (3, 3) the output will be (6)
        • if I set a variable y = 3+3, then y will have a value of 6 anywhere it appears in my code
      • a function can only have one return -> need many returns? use multiple functions
      • the “return” function helps other functions return
    • do
      • changing a pixel in a game, putting a command prompt on the screen, making a sound
      • many functions could come first and pass data around before you ever come to a “do” that the user can see
      • can be a do function just on its own, for example “delay” that makes the program wait
      • code pointer movement functions, just moving code pointers around, like “if” “then” “loop” etc. are do
      • you can’t program a functionality – every function with a “do” is native
    • some functions will do all 3, many will have parameters and then do something or give a return
    • syntax of a function: name (parameters)
    • most of the time, my functions will call other functions – functions inside functions
      • subdividing functions into smaller little pieces is useful because then I can reuse them other places – allows for flexibility & allows me to work on smaller tasks at a time for more gratification/feeling of progress
    • when you use a function, it’s a “call
    • before you ever use it, you need to define a function (tell the computer what to do)


  • there’ll be many custom things I’ll make – functions, variables, arrays & structs of different types
    • variables = holding data directly
    • arrays = bunch of different data each with a number to identify it
    • structs = multiple pieces of data held in a single location (using different sub-names to access them within that location)
  • start by declaring (its type), then space and the name of the variable
    • ex: “int variable_name”

Today’s resources:

A 4-hour FaceTime with my older brother.


viking school’s “How a Website is Built” notes

An example workflow to make a simple blog for a group of 3 friends.

The workflow =

discuss user needs with the client ->

build a mockup & check with client for satisfaction ->

break the mockup into bite-sized stories

story by story, do the following:

->-> determine, set up data architecture

 ->-> build back end

->-> build front end

-> refactor (restructure existing code w/out changing its external behavior), iterate (repeat) & ship (will learn more about this later) site to production

  • he uses Balsamiq to create mockups
  • when creating a story, think about who, what and why
  • in our example, we have 3 stories:
    • As an [author], I want to [publish posts on the site] so that I can [put my thoughts on the web]
    • As a [reader], I want to [easily view the most recent posts] so that I can [stay up to date]
    • As a [reader], I want to [write a comment on that post] so that I can [offer my thoughts on a post]
  • next step is to prioritize which stories to tackle first
  • he uses PivotalTracker to track stories/his progress
  • once selected the story to work on, determine data needs
    • on a whiteboard, pencil/paper etc. – diagram out what you’re going to have to work thru to start planning how you’ll implement it
  • work thru backend->frontend
  • check site/debug throughout
  • refactor (he says his code isn’t good and should be cleaned up – I’m curious as to what this actually means)
  • present to client
cool, now I know what I wanna do.

cool, now I know what I wanna do.

The last few days were spent coding, yes, but also thinking about reverse engineering my future. After reading various explanations of different jobs it’s possible to get after learning how to code, I came across the best one yet, at:


So now I know. I have decided. I’m going to reverse-engineer myself to become a full-stack web app developer.

Amen and goodnight!

Today’s resources:




more more more

more more more

Getting right back to it:

Phishing is when someone masquerades as someone else (often with a fake website) to trick people into sharing their personal information.

Malware = malicious software (usually installed without your knowledge). Malware can be in the form of software masquerading as good (like an anti-virus program that’s really a virus) or it can install itself without asking because of some site you visited. Once on your computer, malware can access your data and files and do whatever with them. Eek!

URL = uniform resource locator, consisting of the protocol (like “http://&#8221;), the domain (like “google.com”) and the path (like “/internet.html”)

◊ The web = the part of the Internet that uses HTTP (hypertext transfer protocol). Which leads me to ask – what are the other parts of the Internet and what are they used for?

◊ A website = a collection of webpages (documents written in HTML) on the same domain.

◊ A browser = a program that can open webpages and display them (by interpreting the source code).

◊ Basically, everything that an everyday user interacts with is a program. 知らなかったよ。

◊ Again, take this as you will (it’s coming from a complete beginner), but I did not previously know that you can “inspect”, aka see the HTML code, of basically any website you’re on. That’s cray-cray!

◊ And one point from actual coding I did (ha): In CSS, classes are marked with a “.” and ids are marked with a “#”. Both of them are more specific than the generic element styling (body, p, h1, h2, li, etc.). However, the rule is only 1 id per page – unlike classes, which you can add to as many elements as you like.

Today’s resources:


https://www.youtube.com/channel/UCVTlvUkGslCV_h-nSAId8Sw (LearnCode.academy’s YouTube channel)

While I’m by no means making crazy leaps and bounds here in my understanding of HTML and CSS, I am starting to wonder why I don’t just try building my own blog layout. Like, from scratch. Instead of this template.