Learning How to Teach with JQuery

Recently I gave a presentation at The Ohio State University’s Collegiate Web Developer Club on JQuery. This has been one of the first times that I’ve been in the front of a class instead of sitting in its seats. It was quite an odd experience and I can now empathize with my prior teachers. Getting a room of 15 students to focus and pay attention to what you have to say can be extremely daunting. However, I recently took a class on Learning how to learn on Coursera and I tried to apply some of the techniques that I learned in the class to my presentation in the classroom.

me

Drawing them in

I found that there’s a difference between handing students the information and making them want the information. I’m sure that not everyone walked in to that classroom and was really excited to learn about the ins and outs of JQuery. This is where credibility comes in. Building this is different for your audience. A group of college students are going to be more interested in an entertaining or funny lecture than a group of colleagues. I will say that some techniques are universal. Humor, analogies, and mental hooks can really aid in getting the audience’s attention. On a recent snap judgment I heard Joyce Lee, a high school teacher, integrated the analysis of Lil Wayne’s rap lyrics into her critical thinking lecture. To a group of professionals, this would seem like a less than ideal example but it pulled in her demographic.

For my talk, I tried to throw in both humor and analogies. Have you ever heard someone tell a joke that you didn’t get and then ask them to explain it? The need to understand it is insatiable. I started off with a pun. ‘Put your $ where your mouth is’ and then said ‘if you get this, you can leave.’(a trick that I learned from a college professor) This got people that understood the joke laughing and got the other students interested in finding out what the joke was about. At the end I threw a similar pun out there ‘Show me the $’ where I asked the students to start one of the exercises. Everyone felt included in the end and it dropped a mental hook that $ === JQuery.

Metaphors to create hooks

I also included a home brewed metaphor in how I understood JQuery. Think of it like a play. You need 3 things:

  1. A stage, actors, and actresses (HTML)
  2. Costumes, makeup, and placement (CSS)
  3. A script that includes stage direction (JQuery)

I know it’s not a perfect analogy but it gets the job done. From there we dove deeper into what was included in a script.

  1. The paper itself ($)
  2. The actor or actress (‘selector’)
  3. The action for them to take or what they should say (action)

This bundles nicely into the syntax for JQuery, $('selector').action()

From there, the most complicated thing to explain is selectors. JQuery does the heavy lifting for you for that one. Since it’s based on CSS selectors, just let them know that they can use their knowledge (or mental hook) that they have from CSS to find the HTML elements.

Everything wraps up into that nice package where each topic smoothly leads into each other.

Teamwork is an education enhancing drug

One of the biggest problems that I’ve had when trying to learn something is I can’t remember what I actually learned as soon as I walk out of the classroom. At this club meeting, we had an activity immediately afterwards where myself and another mentor were available to help answer any questions that came up. I threw in another twist here where I had the students pair up. Pairing is great when you’re learning something with someone else. It can get you out of einstellung when you get two different perspectives. In addition, you’re both ‘in the shits’ together and are more likely to ask for help.

Finally, the one critique on the CWDG of Ohio State would be to have the students work on a small project over the course of the semester. Web development is so large, they could do anything from ‘copy a website’ to come up with their own. This takes everything that they’ve learned in the club and let them create practical applications that are all student driven, not required.

A copy of my talk can be found here The JQuery practice challenge can be found here

Written on October 21, 2015