Complete solution (100% reference)
index.html- Main HTML pagescript.js- JavaScript logicstyles.css- Styling and layoutpackage.json- Dependenciessetup.sh- Setup scriptREADME.md- Instructions (below)💡 Download the ZIP, extract it, and follow the instructions below to get started!
Template Solution for Instructors
This directory contains complete, gold-standard solutions for all 6 debugging challenges in Activity 11, following the teaching pattern established in Project 01 BMI Calculator solution.
Template Solution/activity-11-debugging-challenge-a/
├── script.js # Overview and index to all challenges
├── Challenge-1-Hello/
│ └── script.js # Complete solution for Challenge 1
├── Challenge-2-Intro/
│ └── script.js # Complete solution for Challenge 2
├── Challenge-3-Calculator/
│ └── script.js # Complete solution for Challenge 3
├── Challenge-4-Grades/
│ └── script.js # Complete solution for Challenge 4
├── Challenge-5-Loops/
│ └── script.js # Complete solution for Challenge 5
├── Challenge-6-Function/
│ └── script.js # Complete solution for Challenge 6
└── README.md # This file (instructor guide)
Total Time: 90 minutes Difficulty: Beginner -> Intermediate Type: Debugging practice (not build-from-scratch)
Learning Approach:
Topics: console.log(), alert(), function chaining
File: Challenge-1-Hello/script.js
Line Count: ~330 lines (with teaching comments)
Key Concepts:
alert(prompt("Reply:"))Common Bugs to Plant:
console.log "Hello"console.write("Hello")console.log(Hello!)prompt(alert(...))Assessment Focus:
Topics: Variable declaration, assignment, reassignment
File: Challenge-2-Intro/script.js
Line Count: ~420 lines (with teaching comments)
Key Concepts:
let name;undefined as initial stateCommon Bugs to Plant:
let: let name = prompt(...)let name2 = prompt(...)const (can't reassign)Assessment Focus:
Topics: Math operations, type conversion, +prompt()
File: Challenge-3-Calculator/script.js
Line Count: ~450 lines (with teaching comments)
Key Concepts:
+prompt()Common Bugs to Plant:
+: prompt("Number:") returns string"3" + "2" = "32"Assessment Focus:
+prompt() is needed?+ for strings vs numbers?Topics: if-else statements, comparison operators, ranges
File: Challenge-4-Grades/script.js
Line Count: ~580 lines (with teaching comments)
Key Concepts:
if-else if-else chains for mutually exclusive conditions<, <=, >, >=Common Bugs to Plant:
if instead of else if (multiple alerts!)<= vs < (boundary errors)+prompt())= instead of < (assignment vs comparison)Assessment Focus:
else if is needed?Topics: for loops, iteration, loop counters
File: Challenge-5-Loops/script.js
Line Count: ~430 lines (with teaching comments)
Key Concepts:
i) usage and scopei++ increment operatorCommon Bugs to Plant:
i++ (infinite loop!)i < 10 (off-by-one error)console.log(10)i = 0 (11 iterations)Assessment Focus:
i is scoped to loop block?Topics: Functions, parameters, function calls
File: Challenge-6-Function/script.js
Line Count: ~500 lines (with teaching comments)
Key Concepts:
function keywordCommon Bugs to Plant:
function keywordmultiple5;multiple5()let answer = 5 * 5;Assessment Focus:
Each solution file includes:
// ════════════════════════════════════════════════════════════════════════════
// SECTION TITLE
// ════════════════════════════════════════════════════════════════════════════
/*
🎯 TEACHING POINT: Concept Name
Explanation of why this concept matters...
*/
/*
🎓 INSTRUCTOR NOTES:
COMMON MISTAKES:
1. Error description
SYMPTOM: What student sees
CAUSE: Why it happens
FIX: How to correct it
*/
TESTING EDGE CASES:
- Input: 0 → Expected: ...
- Input: -10 → Expected: ...
DISCUSSION POINTS:
- Why use this approach?
- What if we tried differently?
- How does this connect to real-world?
EXTENSION ACTIVITIES:
1. Easy modification
2. Medium challenge
3. Hard enhancement
4. Expert-level addition
GRADING RUBRIC:
✓ Category 1 (X points)
✓ Category 2 (X points)
TOTAL: 100 points
console.log("✅ Step complete");
console.log(" Variable:", variable);
console.log(" Type:", typeof variable);
Teaching-to-Code Ratio: ~9:1 (comprehensive educational content!)
Total: 44 teaching points, 100+ documented mistakes!
Individual Work (60 min):
Peer Review (15 min):
Class Discussion (15 min):
Formative (During Class):
Summative (After Class):
Use rubrics provided in each solution file!
console.log(typeof variable); // Check if string vs number
console.log("Variable name:", variable, "Type:", typeof variable);
console.log("Step 1 complete");
console.log("Step 2 complete");
// Find where code stops executing
console.log("Condition:", condition, "Result:", condition ? "true" : "false");
console.log("Function called with:", argument);
// Inside function: console.log("Parameter received:", parameter);
Why Critical:
Teaching Strategy:
"3" + "2" -> "32" (wrong!)typeof "3" -> "string"+prompt() converts immediatelyDon't Move On Until: Students can explain string vs number difference!
Why Critical:
Teaching Strategy:
Don't Move On Until: Students understand only one block executes!
Why Critical:
Teaching Strategy:
Don't Move On Until: Students know how to escape infinite loops!
Recommended Pacing:
Total: 100 points
Students have mastered this activity when they can:
✅ Challenge One:
✅ Challenge 2:
✅ Challenge 3:
✅ Challenge 4:
✅ Challenge 5:
✅ Challenge 6:
Questions about teaching this activity?
Need to modify for your class?
✅ Variables and data types ✅ Type conversion and coercion ✅ Conditional statements (if-else) ✅ Loops (for loops) ✅ Functions (declaration, parameters, calls) ✅ Debugging techniques ✅ Problem-solving mindset
✅ Systematic debugging ✅ Error identification ✅ Root cause analysis ✅ Code testing ✅ Technical communication ✅ Self-directed problem-solving
Gold Standard Template Solution Created: 2025-10-10 Follows: Project 01 BMI Calculator teaching pattern Quality: Comprehensive educational documentation (9:1 teaching-to-code ratio) Coverage: 44 teaching points, 100+ common mistakes, 30+ edge cases documented
Ready for classroom use! 🚀