General Concepts

Debugging concepts are similar in most programming languages. The programmer needs to know the state of code variables, constants and the call stack at the origin of error or potential lines in the code in order to determine the root cause.

To do that, most IDEs provide the ability to add breakpoints in code, on such lines.

A breakpoint is an intentional stopping or pausing place in a program, put in place for debugging purposes. ~ Wikipedia

The developer tools provide certain actions at such break points as well as allow you to view the state of code variables, constants and the call stack.

A call stack is a mechanism for an interpreter to keep track of its place in a script that calls multiple functions – what function is currently being run and what functions are called from within that function, etc. ~ MDN Web Docs

Common actions:

  1. Step Into will cause the debugger to go into the next function call and break there.
  2. Step Over will tell the debugger to execute the next function and break afterwards.
  3. Step Out will tell the debugger to finish the current function and break after it.

You’ll need to remember these actions going forward as they will be used quite a lot.