Skip to content

Latest commit

 

History

History
105 lines (73 loc) · 6.17 KB

week_02.md

File metadata and controls

105 lines (73 loc) · 6.17 KB

Week 2

Day 1

Basic HTML Elements, Metadata HTML Elements, Content Grouping HTML Elements, Text Level Semantic HTML Elements

  • Jerome shared his screen and went through the basic structure of an html document. He asked questions such as, “what comes next?” as he went through to check for understanding. He used an html boilerplate to set the initial structure of the html document, linked the stylesheet, put a header in, made a container div, made several divs, added an image, and made

    tags. He gave us several opportunities to take 3 minutes and do whatever we wanted to with the page on our branch on our local machine. He introduced us to favicons (small images or logos often used in website tabs). If you want to take a look at the work that was done on the html page, pull down the changes to the March2021 repo to your local machine and the page we built is under the html-and-css folder. Make sure that if you start playing around with it, it’s on your own branch.

  • Jerome showed us what root css variables are. He said they are the same as universal selectors. An article about it is here. Also we went over how to style the nav bar using flex. Also there’s some default styling we applied that had to do with accessibility. Go here to see those default stylings.

  • Jerome showed us the workflow for GitHub. It goes something like this:

    1. Clone down a repo or if it’s already on your machine pull or rebase to get the latest changes
    2. Make your own branch
    3. Make changes
    4. Push the changes
    5. Pull request and review from a teammate
    6. merge changes
    7. Delete branch to de-clutter

  • Homework:

    1. Use what you learned in class (root variables, default stylings) to your pre-work project and see how much it changes it. You may have to readjust your project to account for these stylings. CSS Reset
    2. Look at the structure of the html document and the css document that we made.

Day 2

Content Embedding, HTML Elements, Images / Multimedia HTML Elements, Global HTML Attributes, Growth Mindset

  • Jerome spoke on growth mindset and touched on the importance of taking initiative with the learning process. GM is founded in the belief that a person's capacities and talents can be improved over time.

  • Content Embedding HTML Elements - we discussed what an eye frame is and what it does. It is basically in embed code that should get from videos posted on the Internet from sites such as YouTube and it allows you to embed videos in your webpage.

  • Images / Multimedia HTML Elements - You can also use our frames to embed things like music we connected a song to the webpage from Spotify which came from the movie 28 days later and goes with our zombie theme

  • Styling Text - we talked about additional tags that are used to segment and identify certain types of text content

    1. The del element

    2. The Strikethough element (use "del" element instead")

    3. The Insert element

    4. The Strong element

    5. The Small element

    6. The Bold element

    7. The Cite element

    8. The Italics element

    9. The Short Quotation element

    10. The Emphasize element

    11. The Code element

    12. The Mark element

Day 3

Content Embedding, HTML Elements, Images / Multimedia HTML Elements, Global HTML Attributes, Growth Mindset Continued

  • We discussed having standups. Questions that will be discussed in the future:

    1. Where you at?
    2. what have you learn?
    3. Anything you need help with?
    4. Talk about blockers
    5. Q & A

  • Apply concepts you learn and change pre-work project as you go. It will be your capstone.

  • We are discussing concepts such as merge conflicts that people don't learn until they get an internship

  • We made made a project under the projects section of our March2021 repo on github

  • We made an issue

  • Made a to-do on github

  • Talked about how to fix merge conflicts on Github

  • Went over issues and closing issues

  • Touched on naming conventions

  • From now on we will be using markdown to keep notes. (use 1 folder for each week. inside the readme put an h1, h2, and notes)

  • Explained the Notion app

  • Went over GitHub profiles

Day 4

Chrome Dev Tools, Box Model, SEO, Website Performance, Coding Conventions

  • Standups included the questions: Where you at? What have you learned? Anything you need help with? Any blockers? Any questions? What have you built lately?
  • We talked about _blank It is not recommended in the context of performance and SEO
  • We talked about the box model
  • Touched on regex. More info is available at regexr, regex101, regex-generator
  • We talked about the difference between margin and padding. If you're moving an element use margin. If you want to take more or less space use padding.
  • Dash was mentioned (download documentation and read examples and learn stuff). The open source version is Zeal. More info is available at dash.
  • If you're going to freelance, WordPress is your friend. It doesn't matter what people say about not being a "real" developer.
  • Mentioned email.js to make a working form
  • Discussed Google chrome dev tools including plugins. Plugins included Lighthouse (heat snapshot, allocation, load time). Learned how to identify inheritance of styles on dev tools and how to spot performance issues on dev tools.
  • A convention is to list your css in html page order.
  • There's a debugger in vs code
  • modals example
  • add and remove from the DOM
  • We mentioned hoisting (unassigned variables) as being a valid use of variables. More info can be found here

Homework

  1. Everything you learned in class this week apply to your profile site