Skip to content

Instantly share code, notes, and snippets.

@johnmboudreaux
Last active June 27, 2017 18:35
Show Gist options
  • Save johnmboudreaux/c7d0cdc8edea2461972e80b399e5501f to your computer and use it in GitHub Desktop.
Save johnmboudreaux/c7d0cdc8edea2461972e80b399e5501f to your computer and use it in GitHub Desktop.

Day 1

chapters 1 & 2

html is short for hypertext markup language and is what describes the structure of the content you see in a web browser.

elements are made by a closing and opening tag.

attributes provide additional info about the contents of an element.

the head is where we would put important information about the webpage. the title is usually in the head and gives the tab at the top of the browser an id and everything in. the body is what the main browser shows.

to see the source, in the view tab go to developer and view source

li is used to make a list element ul defines an unordered list div makes a block in the code to put content in html contains all html content on a web page body contains the ui content on a webpage h defines a heading

empty elements are elements that do not contain words between opening and closing. they usually only have one tag

semantic markup provides extra info for things like screen readers or search engines.

abbr article validation

the link to my first pen: https://codepen.io/jhnbdrx/pen/yXOvoO


empathy plays a role in my life best with my 18 month old. a big chunk of what i have for him is empathy. it has helped me to understand what he needs with a communicaton barrier in place and that his emotions are real to him.

having a vision into another's perspective or need gives you the ability to create something impactful for their world.

empathy is important in a team environment because a team must understand one anothers perspective(s) to resolve conflict, achieve goals and meet deadlines.

i once had a teammate who litterally needed to have weekly vent sessions to be able to function. he was vital to the team , needed to be heard and i had the capacity so, i listened to him until he was done and then we would get back to work.

i find it hard to be empathetic when a teammate repeatedly makes mistakes and doesn't care to take the proper steps or advice to learn from them. i could probably apply more patience in this area to make things better.

Day 2

HTML

There are three main types of lists in HTML: ordered, unordered, and definition. What are their differences?

ordered - a list where each item is numbered. unordered - a list that begins with bullet points definition - a list made up of terms along with a definition for each one.

What is the basic structure of an element used to link to another website? "text that your link will be"

What attribute should you include in a link to open a new tab when the link is clicked? target = "_blank"

How do you link to a specific part of the same page? with an id attribute


CSS

What is the purpose of CSS? to create rules that specify how the content of an element should appear

What does CSS stand for? What does cascading mean in this case? cascading style sheets. you cascade down the sheet and the last rule takes precedence.

What is the basic structure of a CSS rule? a selector with a decleration p{font-style: italic;}

How do you link a CSS stylesheet to your HTML document?

Why is it useful to use external stylesheets as opposed to using interal CSS? so that you can make changes across pages intead of individually on each page.

Describe what a color hex code is. a six digit code that represents the amount of red, green and blue in a color preceded by a pound sign.

What are the three parts of an HSL color property? hue, saturation and lightness

In the world of typeface, what are the three main categories of fonts? What are the differences between them? sarif - have extra details on the ends of the main strokes sans-sarif - have straight ends monospace - every letter is the same width

When specifiying font-size, what are the main three units used? pixels, percentages and ems

Day 3

chapter 7

If you're using an input element in a form, what attribute controls the behavior of that input? type

What element is used to create a dropdown list? select

If you're using an input element to send form data to a server, what should the type attribute be set to? text???

What element is used to group similar form items together? fieldset


chapters 13 & 15

Describe the differences between border, margin, and padding. border-seperates the edge of one box from another as well as margin from padding margin-set sthe size of the gap between boxes padding-set the size of the space between the border and the content in the box

For a CSS rule padding: 1px 2px 5px 10px, what sides of the content box does each pixel value correspond to? top, right, bottom, left

Describe the different between block-level and inline elements. block-level - starts on a new anf acts as the main building block inline - flows between sorrounding text

What is the role of fixed positioning, and why is z-index important in the scenario of using fixed positioning? fixed positioning places an element on the page in a permanent position. z-index gives you the ability to control wether or not the item in fixed position will be on top or below other elements

What is the difference between a fixed and liquid layout? fixed designs do not change size when browswer window does. liquid layouts sttretch and contract with browser size

day 4

chapter 5

In an image element, why is the alt attribute important? in the event that the image does not display, the alt attribute give a brief description. this also applies to the screen reading software.

What determines if an image element is inline or block? where the image is placed in the code.

What are the benefits of jpg or png image file formats? jpg files are better used when there are multiple colors. png files are better used when there are only a few colors like logos or diagrams and are good to use when making an image transparent.

chapter 16

What is the benefit of specifying the height and width of images in CSS compared to specifying in the HTML? it keeps rules that affect the presentation of your page in the css. also you can use css to control the diminsions across the site.

What is an image sprite, and why is it useful? a sprite is when one image is used for several parts os an interface. it speeds up the browser due to only having to load one image.

day 5

javascript

There are three big data types in JavaScript: numbers, strings, and booleans. Describe what each of them are. numbers - numbers are a numeric value. you bits make up numbers and there are only so many numbers that can be made with that limitation. strings - strings are used to represent text. they are wrapped in quotation marks booleans - true or false

What are the three logical operators that JavaScript supports? and(&&) or(||) and not(!)

What is the naming convention used for variables? first character is lower case if there are multiple words the each one begins with a capital case. var thisIsAVariable = 0

What is the difference between an expression and a statement? an expression is a fragment of code that produces a value a statement corresponds to a full sentence in a human language

What are a few JavaScript reserved words, and why are they important to avoid using them for variable names? var - break - for it is important not to use resereved words so not to write confusing code

What is control flow, and why is it useful for programming? when your program contains more than one statement they are executed from top to bottom. it is the flow of the programs that you write whether it is straight forward or contains conditional statements or loops

day 6

If we have a function defined as function sayHello(){console.log("Hello!")}, what is the difference between entering sayHello and sayHello() in the console? sayHello without parenthases will give an error

What is the keyword return used for? it determines the value the function returned. when control reads it, it jumps out of the current function and gives the returned value to the code that called the function

What are function parameters? the argument(s) passed through a function

What is the naming convention used for function names? var x = function(...){...}

day 7

How much work does the user have to do to get what they want?

https://www.reddit.com/ I really enjoy surfing reddit, but their are things i come across that i do not like. the washington post will have an article uploaded with intriguing headers, but when you view the link they block the article and try to force you to sign up with them to read their material. i therefore just hit the back button and skip the articles with their brand on them. but it does not deter me from visiting reddit

Could you get the job done with less input from the user?

https://www.kingsoopers.com/. kingsoopers tracks what you buy with the rewards card. you can then log onto their site and view your history, select items previously purchased, buy them again and have their employees pull the order for you to pick up.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment