jmk2142/debugger

A demonstration of Chrome Debug Developer Tool.

Chrome Debugger Tool

You can actually go straight to the Github Pages below and directly debug that page!

TODO REPO: https://github.com/jmk2142/TodoMSTU5003 TODO DEMO: https://jmk2142.github.io/TodoMSTU5003 DEBUG REPO: https://github.com/jmk2142/Debugger DEBUG DEMO: https://jmk2142.github.io/Debugger YOUTUBE: https://youtu.be/RdF7j4no0Ts

This demonstration application includes most of the basic materials we've covered so far. It is designed not necessarily as an efficient program, but rather to demonstrate how we can use the debugger tool to learn more about the basic concepts as they are applied in context.

Debug Tool Concepts

• Breakpoints and Pause/Resume
• Stepping OVER, INTO, OUT OF functions
• Tool provided annotations
• Interacting with code to get more information
  • Evaluating to console
  • Selecting and inspecting parts
• How these relate to STATE, SEQUENCE, CAUSALITY

Programming Concepts We Debug

• Variables
• Operators
• Evaluations
• Functions
  • Declaration
    • Parameters, Arguments
  • Calls
    • Returns
  • Event Handlers
    • Event Object
• Arrays
  • Indices and Values
• Objects
  • Keys and Values
• Control Structures
  • IF ELSE
  • WHILE
  • FOR
    • FOR OF
• Events and Handlers