Application Debugging Lesson

Application debugging looks at how the whole program behaves, not just one line. A bug might come from state, input, rendering, data loading, or the order that functions run.

Code Runner Challenge

Application Debugging Lesson

View IPYNB Source

%%js

// CODE_RUNNER: Application Debugging Lesson

function renderScreen(appState) {
  console.log("Screen:", appState.screen);
  console.log("User:", appState.userName);
  console.log("Loading:", appState.loading);

  if (appState.loading) {
    return "Loading...";
  }

  return "Showing " + appState.screen;
}

Python Java JavaScript 14px 16px 18px 20px

Lines: 1 Characters: 0

Output

Click "Run" in code control panel to see output ...

A good debugging process starts by reproducing the problem. After that, the developer narrows the area, checks the important values, makes one change, and tests again.

The function logs the main pieces of state before choosing what to render. That makes it easier to understand why the application shows a certain screen.