This week we will be learning the building blocks of making basic web pages: HTML and CSS. We will also focus on using the command line and Git to create a daily workflow for our coding projects.

Daily Goals

Everyone learns at a different pace. Understanding is the most important goal every day. If you feel like you will not be able to complete all of the lessons in a given day, talk to a teacher about ways to ensure that you are covering the day's objectives. And always focus on understanding the concepts at hand, not finishing the work as quickly as possible.

Lessons that have "Homework" in the title indicate that the work is expected to be completed at home and not in class.

Plan

We will begin this week by practicing the command line, Git, Github, and exploring basic HTML. We'll create READMEs to include extra information with our projects on Github. We'll also learn a formatting language called Markdown to format READMEs. Then, we'll explore basic CSS to add styling to our web pages, and actually publish our sites online! Later in the week we will dive deeper into CSS by using divs and spans, floats, cascading, classes, ids, and the box model. Finally, we'll explore a tool called Bootstrap that offers even more powerful styling capability. You're in for a great time!

At the end of this section, you will be able to:

• Navigate the command line to access and create directories and files
• Use Git and GitHub to track the creation of static webpages
• Create a static webpage using HTML
• Style a static webpage using custom CSS rules in a linked stylesheet
• Create a project README.md in Markdown
• Apply Bootstrap rules and classes
• Adapt a webpage for responsive design

Independent Project Objectives

At the end of this section you will complete an independent project. Your instructor will review this project for the following objectives:

• The following HTML tags are all used: p, h, ul, ol, li, em, strong, a, img, div, and span.
• Project includes a custom-made stylesheet that uses typography styles, the box model (including margin, border, and padding), and floats.
• Code is clean, well-refactored, and easy-to-read. This includes correct indendation, spacing, and including only necessary comments and debugging tools.
• Commits are made regularly with clear messages that finish the phrase "It will…"
• The project repo contains a README that includes:
  • author name
  • project or program name
  • description of program
  • program setup instructions
  • link to site on GitHub Pages
  • copyright and license information
• Site is successfully deployed to GitHub pages.
• Project is in a polished, portfolio-quality state.
• Required content was in place by the Friday deadline.
• Project demonstrates an understanding of this week's concepts. If prompted, you can discuss your code with an instructor using the correct terminology.