Website Components

The “Better than Elon Musk” module (Viewing Source Code) is intended to teach all of the significant components of a website using an incredibly simple example. Elon Musk is an incredibly successful immigrant, and he happens to have a website x.com which (as of this writing) consists only of a single character: the letter x. This provides us with the opportunity to look at a lot of the different components of a website without being overwhelmed. The goal of students for the next class will be to create a website that has all of the components of x.com, plus something else, hence they will have built a website better than Elon Musk did.

Digging into code

Having been given a taste of HTML, CSS and Javascript last class, we now will take some time to give a proper introduction. Along the way students will also be forced to use GitHub and Atom and to develop an understanding of source code, rendered code, and the concept of “syntax.”

HTML

Don’t teach attributes yet. Just focus on the concept of the tag and how it affects the rendered output. The name of the tag has semantic meaning. In HTML, text is by default seen as content, and to tell the browser something is code, we need to indicate that it is code with angle brackets.

CSS

Try to get students to make the connection between HTML elements on the page and the selectors. Also go into the fact that different properties exist.

Javascript

Goal for this session is for students to understand that in Javascript, any text is by default assumed to be code, and if we want to have some kind of content or value, it needs to be specially indicated as such (leads into syntax for different var types). Do not cover arrays in this class at all. Only teach objects, numbers, and strings.

Professional Communication

Encourage students to use Slack as a tool to create community and connection, and as a resource when needing help. Strongly encourage students not to wait when they are stuck on something. They need to ask on Slack and get the answer right away, because they are expected to get stuck at least 100 times each sprint, so they need to develop the skills to get unstuck. Explain the difference between getting unblocked “on your own” (without help) and taking the initiative to get unblocked.

Introduce Stack Overflow as a place to ask questions, and talk about the perfect question, warn students not to try to ask the perfect question on Slack.