HTML

• The head element contains information about the webpage.
• The body element represents the visible content shown to the user.
• Good formatting shows parent-child relationships by using indented tabs.
• A tag is shown within angle brackets (<_>)
• Semantic tags are ideal because they describe the element being used.
• HTML is case-sensitive with exception of the declaration of the doctype.
• Some elements must be separated by a space while others must substitute a space with hyphens or underscores.
• Attributes to tags help make tags more specific, such as defining content for screen readers.

CSS

• A margin indicates how much space wanted around the outside of an element.
• A padding indicates how much space wanted around the content inside an element.
• CSS can be written in-line to HTML, in the header to set the page's formatting, or in a separate file linked to the HTML as an href
• class attribute: add style to a specific element or elements, not all elements
• external CSS file is called style.css and needs to be attached to the HTML file with link rel="stylesheet" href="./assets/style.css" inside angle brackets in the HTML head
• colors can be chosen by writing a color name such as "blue" but can be more specifically defined with hexadecimal colors

Git

• Navigating Git or Git Bash
• pwd: print working directory, i.e. name the current open folder location
• ls: list out items in current directory
• cd: move down one directory, i.e. open folder
• cd .: stay in current directory
• cd ..: move upwards one directory, i.e. move back one folder
• mkdir: make directory, i.e. create a new folder at current folder location
• touch filename.extension: create a file using Git Bash
• git branch -d [branchname]: delete a named local branch
• Updating GitHub
1. On local terminal:
1. git branch: check you are on your feature branch
git branch has arguments you can add to them, such as -r and -a
git branch -r: shows all remote branches that have been remotely pulled from GitHub to your local machine at any point in time. Local branches that have been pulled from GitHub then deleted will not show.
git branch -a: shows the same information as -r (all branches from GitHub of branches local on your machine) PLUS local branches that haven't yet been pushed and pulled into GitHub
2. git status: check what has been modified in your feature branch
3. git add -A: add all files to staging OR git add filename: add specific files to staging
4. git commit -m "comment text here": add a message for others to see about your commit
5. git pull origin main: get the most up to date main branch before pushing code to GitHub
6. git push origin feature/branchname: push your branch updates to GitHub
2. On GitHub website:
1. Open feature branch in repo --> should show Main to feature branch
2. Create a pull request (PR) with a descriptive title and also 1) instructions, 2) functionality decription, and 3) how to test for peer review
3. After approval, click Merge Pull Request
• Adding New Branch to Main
1. On local terminal:
1. git checkout main: switch (i.e. local terminal looks at) to updated main branch from GitHub
2. git pull origin main: pull the newest main branch to the local environment OR git pull: pulls the most recently viewed branch, which in this case is Main
3. git checkout -b feature/new-branch-name: create and switch to a new feature branch
4. git status: verify that the terminal is on the new branch
5. code .: open the local IDE (VS Code) to begin editing
6. NOTE: If you forget to pull from main, you will have to add a step before opening the editor
• git merge main: merge the newly created out-of-sync feature branch with the updated main branch on GitHub

JavaScript

• JavaScript is referred to as JS, and the file extension is .js
• JS adds functionality to a page for when the User interacts with it, like filling out forms, clicking buttons, etc.
• JS has many built-in objects, which in turn, have many built-in methods to use without having to "reinvent the wheel"
• variable: a named container that allows storage of data in code
• var VariabeName: defines and names a variable. This is called "declaring" a variable.
• var category = ["item1", "item2", "item3"];: defines and names a variable and an array (or list) of values/objects assigned to the variable
• control flow: the order in which a computer executes code in a script
• When writing a webpage, connect HTML and JS with script src="./assets/script.js" within script angle bracket elements after the footer but still inside the body
• Chrome DevTools: shows developers on Chrome browser how JS works with the website being viewed
• right-click a webpage and select Inspect, and navigate to the Console tab
• Cmd+option+I: Mac shortcut to open Chrome DevTools in Google Chrome
• Cntrl+Shift+I: Windows shortcut to open Chrome DevTools in Google Chrome
• loop: using a predictable pattern to cycle through data
• create a for loop
1. loop starting point: declare a variable and give it a value, for example var x = 0;
2. set a condition: the loop will continue to run until the conditoin is no longer met, for example x < shapes.length;
3. allow the array to iterate over each listed item: x++ (it's a shortcut for x+1)
4. EXAMPLE: for(var x = 0; x < shapes.length; x++) { // code block }
• create an if loop
1. loop starting point: if(condition)
2. optional secondary cases: else if / else
3. EXAMPLE: