Skip to content

Latest commit

 

History

History
66 lines (43 loc) · 3.6 KB

debugging.md

File metadata and controls

66 lines (43 loc) · 3.6 KB
Raw

Debugging

Projected Time

1.5 to 2 hours

  • 12 minutes for video walkthrough of slides
  • 45 minutes for Independent Practice #1
  • 30 minutes combined for Independent Practice #2 & Group Practice #1

Prerequisites

  • Techtonica's HTML/CSS & JS workshops
  • "Asking Good Questions" lesson
  • "Chrome Developer Tools" lesson

Motivation

Things will go wrong during programming, even for experienced software engineers. It's important to quickly trouble-shoot code that is not behaving as expected.

Objectives

Participants will be able to:

  • Understand the various kinds of errors that may arise
  • Use console.log() statements to verify logic and output at different points in the code
  • Use the rubber duck technique to talk through troublesome code
  • Debug their JS code using Chrome Developer Tools

Specific Things To Teach

  • Types of errors
  • Good debugging strategies
  • Bad debugging strategies

Materials

Lesson

Debugging (video walkthrough of slides)

Debugging (slides)

Common Mistakes / Misconceptions

  • "Dang it, I got a bug. Let me ask for help right away." At Techtonica, you should spend at least 20 minutes debugging on your own before asking someone else for help. This is to give yourself the learning opportunity that happens when you struggle, and also to protect others people's time. Once you're in a work setting, ask your manager or teammates how long they expect you to puzzle through something on your own before asking for help.

  • "I don't want anyone to know that I'm struggling with this, even if I have to waste several hours figuring this out on my own." Most managers and colleagues expect that Junior Software Engineers will still need a lot of training and do not expect you to know everything. Learning how to ask strong questions makes you come across as competent and curious, even when you aren't sure about how to do something.

  • "Getting a bug is a personal failure." Nothing is personal with how computers execute your code. Even experienced software engineers get bugs. No one is perfect!

Independent Practice

  1. Techtonica staff will assign pairs. In pairs, work through the Get Started with Debugging JavaScript with Chrome Dev Tools (tutorial).

  2. On their own, each participant writes a program of their choosing using REPL.it and places at least 1 bug in it.

Group Practice

  1. To go with #2 from the Independent Practice: Techtonica staff will assign pairs. Try to de-bug the program your partner wrote in REPL.it. Swap pairs at least 2 more times so everyone has multiple opportunities to debug someone else's code.

Supplemental Resources

  • https://dzone.com - if stackoverflow & medium had a baby - basically a really well organized library of technical resources, in depth subject guides, refcards/cheat sheets and more. The key is that they bring a teaching + journalistic approach which is fantastic.
  • Debugging Tips and Tricks by Sarah Drasner

Check for Understanding

In a roundtable discussion format, participants share the kinds of bugs they encountered in each other's code, how they were able to identify those bugs, and what they did to fix them.