/OOJS-sprint

Javascript workshop focused on Object Oriented javascript and touching on API development. Geared towards intermediate learners.

Primary LanguageCSS

JavaScript Deep Dive - OOJS + APIs

This presentation is intended for intermediate learners with some experience in Javascript and jQuery. The ultimate goal is for the audience to come away with:

  • understanding of what Javascript is and why it's important
  • what are objects in JS and why are they important
  • creating JS objects through object literal and constructor functions
  • prototypal inheritence
  • what an API is and how to get started using them

Agenda

The workshop should take about 1.5 hours in total:

15 mins - Intros and Icebreaker
15 mins - Part 1: Overview of Why JS matters, examples, and tools we're using
10 minutes - Part 2a: Basics of objects in JS - object literals
10 minutes - Breakout to code their own basic objects

30 minutes - Part 2b: Deeper dive into objects - constructor functions and prototypal inheritance
10 minutes - Part 3: What is an API and how basic overview or working with the Twitter API

Icebreaker

Option A - Quirks

  • Everyone goes around the room and answers the following:
  • What is a quirk about them?
  • Where are they from?
  • Why are they here?

Option B - Ball Game

  • Everyone cirles up
  • First person has a ball, says their name then tosses the ball to someone else. That person then says thank you "name", then say their name and repeat until everyone has said their name and touched the ball.
  • redo in same order
  • redo without thank you and just names
  • redo with no names and cut time in half
  • redo cut time in half again and aim to get under 6 seconds for group of 20

Notes for Presenter

  • When presenting, press 's' on the keyboard to show speaker notes (for questions, asides, etc).

  • Make sure to show how to use each tool when going over the tool section (especially the console).

  • Get to the breakouts as fast as possible, and constantly bring up the console and sublime to showcase concepts. Students learn best when they're the ones typing or seeing live coding, and not just listening to us lecture.

  • add ?print-pdf to print slides to PDF. (e.g. index.html?print-pdf#/)