Prework Study Guide
✨ Open the Console to See What's Happening ✨
HTML
- The head element contains information about the webpage.
- The body element represents the visible content shown to the user.
- The title element defines the title for a webpage. Which is important for SEO.
- The style element defines the CSS styles associated with a website.
- The base element defines the base URL for a webpage.
- The link element connects an external resource to the HTML document.
- The meta element defines metadata such as the character set, description, keywords, author, and viewport.
- The script element embeds client-side scripts in the HTML document.
- The charset element sets our character encoding.
- The http-equiv element sets an HTTP header for content.
- The viewport element sets the default view for our webpage.
- An element refers to the entire element from opening tag to closing tag, whereas a tag refers only to what appears inside the angle brackets.
- The h1, h2, h3, h4, h5, and h6 elements represent the level of heading a given text block represents
- The p element represents a paragraph or block of text.
- The ul, ol, and li elements represent unordered lists, ordered lists, and list items.
- The img element contains information about images that are displayed on the webpage.
- The br element creates a line of empty space, or a line break, between two blocks of content.
- The a element creates links to the same webpage or other webpages. While href points to URL ex. a href="LINK"
- The section elements are semantic elements that define a section in a document that contains thematic content.
CSS
- There are three ways to style a webpage using CSS: inline CSS, internal CSS style sheet, and external CSS style sheet
- Inline CSS is using the style attribute to change the color of a single h1 heading
- Internal style sheet contains CSS rules for the webpage in the head section of the HTML file
- External style sheet link the file using a link element placed in the HTML's head
- The margin property indicates how much space we want around the outside of an element
- The padding property adds space around the content inside an element
- An * applies a rule to all the elements visible
- Don't Repeat Yourself (DRY) is a coding principle that encourages developers to reuse code in order to reduce the number of lines on the page
- The link element creates a connection to an external file
- The rel attribute specifies the relationship between the current document and the linked document
- The href attribute specifies the location (URL) of the external resource
- Class attributes allow us to share a CSS rule to any element we choose
Git
- The git checkout command goes to the branch listed (add -b to create new branch)
- The cd command opens the listed directory
- The git status command shows imformation about current branch inlcuding differences to main branch or information staged to be pushed
- The git commit -m "notes here" command stages a file to be committed with notes
- The git push origin main command pushes any staged changes to the current branch
- The git pull origin main command pulls changes from main branch into current working branch
- The git add -A adds all changes for commit
JavaScript
- The .js file extension indicates that this file is a JavaScript file
- To declare a variable we use the var keyword and then a unique name
- All strings are surrounded by quotation marks.
- Each line of JavaScript code ends with a semicolon
- The word console refers to a test environment that developers use to check out their code.
- A method is a set of instructions that can be executed by a computer
- The console.log method was created to make it easier for developers to test their code
- An if statement is a way of introducing decision-making into our code, code will only execute if the statement meets a condition
- The strict equality operator (===) checks to see if two values are equal, and returns a Boolean result true if the values are equal and false if the values are not equal
- An array is a variable used to store a group of related data
- A for loop is used to perform a task on each piece of the data in an array
- In JavaScript and many other programming languages, arrays are zero-indexed and sequential (starts with 0,1,2,3,etc.)
- You can find the length of an array by using a built-in property of an array "length"
- A for loop contains the following three important statements: Starting point for our loop (var x = 0;),condition(x < shapes.length;), final statement (x++)