JS 200 Lesson Plan

An example meetup description for this workshop is here.


Facilitator Prep:




TA prep:



Schedule:


11:00

Setup tables, name tags

11:30

Students start arriving, eating lunch, setting up their laptops

Make sure they’ve added GDI chapter account as coach and that they’re on the Slack channel.

12:00

Welcome, start round of introductions with an intro quick question

12:10

Sponsor welcome, if a sponsor host is available

Present “What is GDI?”

12:15

Introduce yourself to person nearest to you, with an intro question

12:20

Talk about the structure for workshop - self-paced learning, *skip* the projects and keep going, then we pair on projects together.

12:25

Watch “Welcome to making webpages interactive”

or Present Slides version

Ask them:

  • What their favorite interactive webpage is, or favorite webpage interaction is

  • Where did they learn JS from?

12:45

Start self-paced learning:

Tell them to briefly do the quizzes, but spend no more than 20 minutes on them, before starting on “JS in the DOM”

2:25

Present What is pair programming?

(Give shortened version if most have already paired before)

2:30

Demo: Use the JavaScript console in dev tools, FF and Chrome. Show that you can write code like document.getElementById, and you can inspect elements to find out their attributes/tag names.

2:35

Pair Project: (paste into doc)

If you’ve done DOM modification: Extreme Makeover, Webpage Edition

Else If you’ve done DOM access: DOM Detective

3:00

Project show & tell (if there are any)

3:05

Re-start self-paced learning

5:00

Demo: Bookmarklet

 

Pair Project: (paste into doc)

If you’ve done DOM events, do Project Pet Painter

If you’ve done DOM modification: Extreme Makeover, Webpage Edition

If you’ve done DOM access: DOM Detective

6:10

Present “Thanks for coming!”

Go home!