🔮Unit 2 Overview

How can I create a more interactive webpage using Javascript?

Overview

In this second unit, students learn to make interactive websites using javascript event listeners, and DOM manipulation. In the earlier part of the unit, students learn data types, arrow functions, and querySelector(). They learn to change the class list of DOM elements and add or remove innerHTML text from the webpage based on clicks and user inputs. Later in the unit, the students will use if else conditional flow in their code.

To finish the unit, students will create a final project page utilizing all of the skills they have learned in the unit to create an accessible interactive website that is meant to help the user in some way.

NYS Standards [Courtney Add]

NB: HTML and CSS are considered 'mark-up' languaes, not programming languages. As such, many Computational Thinking skills will be better addressed in future units.

• 9-12.DL.1 Type proficiently on a keyboard.

• 9-12.DL.2 Communicate and work collaboratively with others using digital tools to support individual learning and contribute to the learning of others.

• 9-12.DL.5 Transfer knowledge of technology in order to use new and emerging technologies on multiple platforms.

• 9-12.IC.1 Evaluate the impact of computing technologies on equity, access, and influence in a global society.

• 9-12.IC.5 Describe ways that complex computer systems can be designed for inclusivity and to mitigate unintended consequences.

• 9-12.IC.6 Create accessible computational artifacts that meet standard compliance requirements or otherwise meet the needs of users with disabilities.

Suggested Duration

Approx. 3-5 weeks for core content and 2-3 weeks for the Final Project.

Prerequisite Skills

This second unit assumes little to no prior knowledge of Javascript, but does require familiarity with HTML and CSS. Though heavily javascript focussed, many labs will require identifying IDs and classes in HTML for javascript querySelectors, and extensions will now and then encourage CSS styling. Lesson 1 and Lab 1 are completely javascript focussed.

As this is an intermediate course, students are recommended to have had some computer science exposure prior to starting; being able to interact with an IDE/editor and code documentation will make life easier and allow students to move through content more quickly.