Intermediate Web Development
This course builds on the Beginning Web Development course and covers making websites dynamic and interactive with JavaScript. Students will learn how to build web-based games with HTML, CSS, and JS.
Lesson 1: HTML Review
Week 1 Day 1 | Slides
This lesson reviews the concepts for HTML in the Beginning Web Development course, particularly tags and attributes.
Lesson 2: More HTML Review
Week 1 Day 2 | Slides
This lesson continues reviewing HTML tags and attributes and also covers folders and file paths.
Lesson 3: Review of CSS Selectors
Week 2 Day 1 | Slides
This lesson reviews how to import CSS files into HTML code and how to use the three basic CSS selectors: id, class, and tag name.
Lesson 4: Review of CSS Properties
Week 2 Day 2 | Slides
This lesson reviews some of the most common CSS properties, including background-color
and
text-decoration
. It also reviews the Box Model for element sizing and the width
,
height
, padding
, border
, and margin
properties.
Lesson 5: Introduction to JavaScript
Week 3 Day 1 | Slides
This lesson introduces the JavaScript language and script
tag.
Lesson 6: Booleans, Conditionals, Comparisons, and Variables in JavaScript
Week 3 Day 2 | Slides
This lesson introduces the <boolean>
data type and conditionals, including several
operations that generate boolean values, like comparisons and window.confirm()
. It also
introduces the concept of variables in JavaScript.
No class. Mid-winter break
Week 4
Lesson 7: Compound conditionals and loops
Week 5 Day 1 | Slides
This lesson introduces compound conditionals and how to repeat tasks with loops.
Lesson 8: Random numbers and editing elements with JavaScript
Week 5 Day 2 | Slides
This lesson covers generating random
numbers and how to change HTML elements with JavaScript code.
Lesson 10: Using Functions as Variables
Week 6 Day 2 | Slides
This lesson covers passing and using functions
as variables in JavaScript.
Lesson 11: Intermediate CSS
Week 7 Day 1 | Slides
This lesson covers intermediate CSS
in JavaScript.
Lesson 12: More Intermediate CSS
Week 7 Day 2 | Slides
This lesson introduces more intermediate CSS
in JavaScript.
Lesson 13: Capstone Project (part 1)
Week 8 Day 1 | Slides
This lesson covers building the Capstone Project.
Lesson 14: Capstone Project (part 2)
Week 8 Day 2 | Slides
This lesson covers building the Capstone Project.
Lesson 15: Capstone Project (part 3)
Week 9 Day 1 | Slides
This lesson covers building the Capstone Project.
Lesson 16: Capstone Project (part 4)
Week 9 Day 2 | Slides
This lesson covers building the Capstone Project.