HTML
- !DOCTYPE - is not case-sensitive because it is a declaration. Declarations are not case-sensitive; HTML elements are case sensitive
- html - attributes are always defined in the beginning element, lang = "en" tells language for the webpage
- meta tag - defines metadata about an HTML document, meta tags go inside the head element
- head - element contains information about the webpage element is a container for metadata
- the head element - in this case defines the following three elements charset, http-equiv, viewport
- charset - elements sets our character encoding
- http-equiv - elements sets an HTTP header for content
- viewport - element sets the default view for our webpage
- title - of the webpage is defined is the one exception is that we should be able to see if we open index.html to look at browser's title
- Body - element represents the visible content shown to the user.
CSS
- A margin indicates how much space we want around the outside of an element
- A padding indicates how muich space we want around the content inside an element
- * selector card symbol to declare all elements on the page
- touch style.css create a file that will contain your css style
- CSS box model every html element is essentially a box
- header, footer selectors combined two selectors into a single CSS rule with a comma, allowing the declarations to affect both
- h1, h2 rule assignment is a positioning property text-align and lets us style our h1 and h2 heading text
- img selector assigns property values to any image element in the markup. The display property is assigned with the block value
- ul unordered list element declares the font to be 20px and the padding on the left of ul list to be 40px
- p paragraph to be centered on the page with a font size of 30px
- link element create the connection to the external file ->link rel="stylesheet" href="./assets/style.css"
GIT
- git revert a8a3...___insert SHA version to go back to fix a problem
- git status; checks what branch we are currently on
- 1.git add -A command to stage your changes to commit all files in the working branch
- 2.git commit -m "[descriptive msg]"commit your staged content as new commit snapshot
- 3.git pull origin main ALWAYS PULL the base branch not your feature branch before pushing up any code
- 4.git push origin feature add/html push up all of your changes
- git checkout -b branch name: creates a-new branch and switches to it
- git checkout main in order to switch to the main branch
- git branch list your branches
- Git Bash: ls -al ~/.ssh list the files in your .ssh directory, if they exist
JavaScript
- A variable is a named container that allows us to store data in our code.
- Control flow is the order in which a computer executes code in a script TOP/BOTTOM
- in javaScript to declare a variable we use the var keyword, ex. var shape = "circle";
- var topics = "HTML, CSS, Git, JavaScript"; all strings are surrounded by quotations marks ends with semicolon
- console.log(topics)
will output the value of topics by adding argument, use to test your code - to link js file to the html file use script tag src="./assets/scripts.js">
- an if statement in a JavaScript file will check if the condition that we have is truthy/falsy
- if (0) {
console.log("I'm 0!")
} else if(null) {
console.log("I'm null!")
} else if (true) {
console.log("I'm true!")
}
} - the strict equality operator(===) checks to see if two values are equal: returns true if values are equal or false if not equal
- to create array var shapes = ["triangle", "square", "pentagon", "circle"];
- a single array can store different data types, ex. var studentInfo = ["Luu", 54, true];
- each item is assigned an index according to the order in which it is stored in array: 0, 1, 2, 3...
- to access data in the array start with the name of the variable that stores the array shapes[0]: console.log(shapes[0]);
- for loops to operate on each element in an array for(var x =0; x < shapes.length; x++) {
console.log(shapes[x])
}