Small fixes (#50)

* Small general improvements

* Change aside to block quotes

docs/unit1.mdx

@@ -19,7 +19,7 @@ This unit we are going to briefly cover GitHub, READMEs, Markdown, and GitHub Pr
 
 [GitHub](https://github.com) is a website for you to backup your code. It makes it easy for you to collaborate on projects with others. You should treat it like a portfolio for your work as a software developer.
 
-Create an account at [https://github.com/signup](https://github.com/signup)  
+Create an account at [https://github.com/signup](https://github.com/signup). Optional, but highly recommended to also sign up for the [Student Developer Pack](https://education.github.com/pack)!  
 *Note: Since you will have this for a long time, use your personal email, not your school email.*
 
 ## README.md

docs/unit2.mdx

@@ -77,9 +77,11 @@ When typing commands in terminal, you might find yourself looking to make a quic
 
 ![Vim](../static/img/unit2/vim.png)
 
-Vim is a lightweight text editor, you can use inside of your terminal. You will find that many programmers use this editor, known for its mouse-less interaction. However, it is a little complicated, so let's get started.  
+Vim is a lightweight text editor, you can use inside of your terminal. You will find that many programmers use this editor, known for its mouse-less interaction. However, it is a little complicated as the modal based editing is different from anything you probably are used to, so let's get started.  
 
-**Opening a File**  To open a file just type in `vim FILE_NAME` into your terminal.  This should open up the vim editor in your terminal. 
+**Opening a File**
+
+To open a file just type in `vim FILE_NAME` into your terminal.  This should open up the vim editor in your terminal. 
 
 **Modes**
 
@@ -89,7 +91,7 @@ The most important one will be hitting *i* (for “insert”), which will change
 
 **Saving the File**
 
-To save and exit the file, make sure you're in command mode. Press : and you will be in last-line mode. In this mode, you can enter commands like `:w` to save or `:q` to exit. You can even combine these and type `:wq` to save and exit.
+To save and exit the file, make sure you're in command mode. Press : and you will be in last-line mode. In this mode, you can enter commands like `:w` (write) to save or `:q` (quit) to exit. You can even combine these and type `:wq` (write and quit) to save and exit.
 
 ### Nano
 
@@ -121,12 +123,9 @@ To save and exit the file, you will be using two commands. Ctrl + O, saves the f
 In your root directory, type `ls -a` to find your `.bashrc` file. 
 If you are on MacOS (post Catalina) you may have a `.zshrc` file instead. 
 
-This file will run every time that you start a new terminal. Inside of it, you can add your own custom aliases, functions, and customize you prompt.
+This file will run every time that you start a new terminal. Inside of it, you can add your own custom aliases, functions, and customize your prompt.
 
-<aside>
-💡 When you make changes to the `.bashrc` or `.zshrc`, those changes won't take effect until open up a new Terminal window or run `source .bashrc` (`source .zshrc` on Mac)
-
-</aside>
+> 💡 When you make changes to the `.bashrc` or `.zshrc`, those changes won't take effect until open up a new Terminal window or run `source .bashrc` (`source .zshrc` on Mac)
 
 ### Functions and Aliases
 
@@ -149,13 +148,15 @@ You can learn more about functions [here](https://linuxize.com/post/bash-functio
 
 ### Customizing Your Prompt
 
-There are lots of things you can do with your prompt. It can print the current directory you're in, show the time, display the git branch, and more. You can even add colors! This is done using special prompt characters.
+As a developer, you will be spending a lot of time in your terminal so you want it to be as comfortable of an experience as possible. There are lots of things you can do with your prompt. It can print the current directory you're in, show the time, display the git branch, and more. You can even add colors! This is done using special prompt characters.
 *Note: the special characters may differ between `.bashrc` and `.zshrc`.*
 
 In `.bashrc`, for example, `\d` will print the date, `\u` will print the current user, and **`\w`** will print the current user. You can find a list of commands in this [Bash Prompt Guide](https://ss64.com/bash/syntax-prompt.html).
 
 For `.zshrc`, please refer to this [ZSH Prompt Guide](https://blog.devgenius.io/customize-the-macos-terminal-zsh-4cb387e4f447) and the [ZSH Prompt Documentation](https://zsh.sourceforge.io/Doc/Release/Prompt-Expansion.html#Prompt-Expansion).
 
+For even more customization, such as adding autocomplete or syntax highlighting plugins check out frameworks like [Oh My Zsh](https://ohmyz.sh/).
+
 ---
 
 ## Assignment

docs/unit3.mdx

@@ -17,13 +17,13 @@ This unit, we'll be combining what we've done in the past 2 units, to learn more
 
 ## Git
 
-### 🤔 Why git?
+### 🤔 Why Git?
 
-And why not google drive? 🤨👎
+And why not Google Drive? 🤨👎
 
 A reason why Google Docs has become so popular because it made an easy way for a team to collaborate on a document together. A powerful tool Google Docs provides is `revision history` which gives document owners a way to view and manage past versions of the document. This can be called **version control.**
 
-Git is the leading form of version control for source code. It is built around the importance of tracking changes and managing collaboration. These features make Git the right tool for programming small and large projects. 
+Git is the leading form of version control for source code. It is built around the importance of tracking changes and managing collaboration. These features make Git the right tool for programming small and large projects. While it may be unfamiliar to you now, Git is one of the most used technologies across any area of software development so stick through it and you will reap the benefits later on.
 
 ### The Git Workflow
 
@@ -99,14 +99,11 @@ SSH, also known as Secure Shell, is a way to let users access and authenticate t
 
 ### Why are we using SSH?
 
-When we are working with out GitHub repository, you will need to identify yourself with your username and personal access token. With SSH keys, you can connect to GitHub without supplying your username and password each time. To use SSH with GitHub, you will need to create the key, then add it to your GitHub account.
+When we are working with our GitHub repository, you will need to identify yourself with your username and personal access token. With SSH keys, you can connect to GitHub without supplying your username and password each time. To use SSH with GitHub, you will need to create the key, then add it to your GitHub account.
 
-<aside>
-💡 As of August 13, 2021, [GitHub no longer supports https password authentication](https://github.blog/changelog/2021-08-12-git-password-authentication-is-shutting-down/). 
+> 💡 As of August 13, 2021, [GitHub no longer supports https password authentication](https://github.blog/changelog/2021-08-12-git-password-authentication-is-shutting-down/). 
 You **must** use SSH moving forward.
 
-</aside>
-
 ### To create an SSH Key
 
 1. Open the Terminal

docs/unit6.mdx

@@ -124,6 +124,8 @@ This function takes 2 elements and returns a value that determines how to order
 | < 0 | sort a before b |
 | === 0 | keep original order of a and b |
 
+> 💡 The use of `===` is intentional here! Check out this [Stack Overflow thread](https://stackoverflow.com/questions/359494/which-equals-operator-vs-should-be-used-in-javascript-comparisons) for an in depth dive on `==` vs `===` in JavaScript.
+
 
 ```javascript
 // Sort the list of words ignoring uppercase
@@ -318,7 +320,10 @@ const otherSayHello = (firstName, lastName) => {
 	return "Hello, " + firstName + " " + lastName;
 };
 ```
-Arrow functions return a value by default, so if it only requires one statement to write the function, we can cut it even shorter. 
+
+In an arrow function, the arguments are defined in the parenthesis (in this case `firstName` and `lastName`) and the function body is defined in the curly brackets after the arrow, hence the name.
+
+Arrow functions return a value by default, so if it only requires one statement to write the function, we can cut it even shorter by removing the brackets and the `return` keyword. 
 
 ```javascript
 const otherSayHello = (firstName, lastName) => "Hello, " + firstName + " " + lastName;

docs/unit7.mdx

@@ -73,11 +73,20 @@ Alright, you've waited long enough. Back to React! React is built upon many comp
 Here's an example: 
 
 ```jsx
-function Welcome(props) {
-  return <h1>Hello, {props.name}</h1>;
+function ShoppingList(props) {
+  return (
+    <div>
+        <h1>Shopping List for {props.name}</h1>
+        <ul>
+            <li>"Instagram"</li>
+            <li>"WhatsApp"</li>
+            <li>"Oculus"</li>
+        </ul>
+    </div>
+  )
 }
 
-// Example usage: <Welcome name="Mark" />
+// Example usage: <ShoppingList name="Mark" />
 ```
 
 ShoppingList is a **React component class.** A component takes in parameters called `props` (short for “properties”), and returns a hierarchy of views to display. 
@@ -90,7 +99,7 @@ React renders elements in the React DOM (or Document Object Model). The DOM is a
 
 This component returns what we want our user to see on their screen. More specifically, the function returns a **React element**. Components are made of a hierarchy of elements. 
 
-- The above example really looks like this (Beware, the code is not pretty):
+- Using normal JS the above example really looks like this (Beware, the code is not pretty):
 
     ```jsx
     React.createElement("div", {
@@ -206,11 +215,11 @@ function Example() {
 
   return (
       <div>        
-          <h1>Hello, world!</h1>
-          <h2>The counter is at {count}.</h2>
-          <button onClick={() => setCount(count + 1)}>
+            <h1>Hello, world!</h1>
+            <h2>The counter is at {count}.</h2>
+            <button onClick={() => setCount(count + 1)}>
 		        Increment!
-		      </button>
+            </button>
       </div>
     );
 }
@@ -221,7 +230,7 @@ There's a lot going on here, so let's break it up:
 2. `useState` is a Hook, that we call inside a function Component to give it a local state. A state lets us preserve these values after the function call ends. 
     1. We pass in an argument to initialize the state, which is `0`. 
     2. `useState` returns a pair: the current state value `count`, and a function that lets you update the state to a new value `setCount`
-        1. We use syntax called “array destructuring”. Also in python, this lets us set variables to individual items in an array. More on this below.
+        1. We use syntax called “array destructuring”. Also in Python, this lets us set variables to individual items in an array. More on this below.
 3. For the function component we return the markup for the component. Notice the use of curly brackets around our JavaScript.
     1. In `<h2>`, we refer to our state variable to display the current count: `count`
     2. In `<button>`, we attach the function call `() => setCount(count + 1)}` so when the button is clicked, the `setCount` is called, updating our State, and re-rendering our component. 
@@ -356,11 +365,11 @@ function NumberList(props) {
     </li>
   );
   return (
-		<ul>
+	<ul>
       {numbers.map((number) =>
         <li key={number.toString()}>
-		      {number}
-		    </li>
+		  {number}
+        </li>
       )}
     </ul>
   );
@@ -386,7 +395,7 @@ function Example(props) {
 ```
 
 ## Setting up React
-With node installed, it also comes with `npm` a package manager for node. `npx` is a package runner that is pre-bundled with `npm`. We use `npx` to create our first react app. 
+With node installed, it also comes with `npm`, a package manager for node. `npx` is a package runner that is pre-bundled with `npm`. We use `npx` to create our first react app. 
 
 Navigate to a directory where you want to create your project. Then, run the command: 
 

docs/unit8.mdx

@@ -16,7 +16,7 @@ This will let us spice up our project, and include more from the web.
 
 <Video src="https://www.youtube.com/embed/wHWBw-lHdLM" />
 
-Only the 100 seconds, we won't be talking about how to build an API (around 2:30)
+Only the first 100 seconds, we won't be talking about how to build an API (around 2:30)
 <Video src="https://www.youtube.com/embed/-MTSQjw5DrM" />
 
 <Video src="https://www.youtube.com/embed/eIQh02xuVw4" />