Debugging (breakpoints, watch, call stack)#

Why a debugger when there's Console.WriteLine#

Logs are a blunt axe. A debugger lets you stop the program at any point, inspect every variable and trace how control got there — with no rebuild and no cluttering the code. It's the first tool you reach for when something "behaves differently than I think".

Breakpoints#

Click in the margin next to the line number (or press F9) to set a breakpoint. The program will stop before executing that line.

Action	Visual Studio	VS Code
Start debugging	F5	F5
Step over	F10	F10
Step into	F11	F11
Step out	Shift+F11	Shift+F11
Continue	F5	F5

Conditional breakpoints#

Don't stop on every iteration. Right-click the breakpoint → Conditions and give a condition, e.g. userId == 4071. The program will stop only when the condition is true — priceless when looping over thousands of records.

You can also set a Hit Count (stop on the 50th hit) or an Action / Tracepoint — log to the Output window without stopping the program.

Watch and inspecting variables#

While debugging, hover over a variable to see its value. For a persistent view, add the expression to the Watch window. The Locals window shows all variables in the current scope, and Autos — those used nearby.

// Stop on this line and add 'order.Total' and 'order.Items.Count' to Watch
var summary = CalculateSummary(order);

In the Immediate window (Visual Studio) or Debug Console (VS Code) you can type expressions while paused — e.g. call a method and see the result.

Call stack — how did I get here#

The Call Stack window shows the chain of calls up to the current point. Clicking a frame jumps to the calling code and shows its local variables. This is key when diagnosing exceptions — it shows who passed the bad value.

Tip: When you catch an exception, open the Call Stack and go down until you find the last line of your code. That's usually where the cause lies, not in a library.

Debugging the ZEUS frontend in VS Code#

For Next.js, configure .vscode/launch.json and debug with breakpoints in the TypeScript code:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Next.js: debug server",
      "type": "node-terminal",
      "request": "launch",
      "command": "npm run dev"
    }
  ]
}

Summary#

A breakpoint tells you where, Watch tells you what, and the Call Stack tells you how you got there. Mastering conditional breakpoints and reading the call stack cuts diagnosis time from hours to minutes — and it works identically in the .NET backend and in the ZEUS frontend.