Skip to content
Learn Netverks

Lesson

Step 5/36 14% through track

devtools-console

DevTools and the console

Last reviewed Jun 1, 2026 Content v20260601
Track mode
client_javascript
Means
In-browser JS
Reading
~1 min
Level
beginner

This lesson

This lesson teaches DevTools and the console—the ideas, syntax, and habits you need before moving on in JavaScript.

Fast feedback in the browser separates productive front-end developers from guess-and-refresh cycles.

You will apply DevTools and the console in contexts like: Browsers, Node.js services, edge workers, and tooling ecosystems (bundlers, test runners).

Run JavaScript in the in-browser sandbox, use the terminal output panel, and verify with MCQs.

Early in the track—complete this before layout, scripting, or architecture lessons that assume these basics.

Browser DevTools (F12 or Inspect) include Elements, Console, Network, and Sources—essential for front-end debugging.

Console API

  • console.log — general output
  • console.warn / console.error — severity levels
  • console.table — tabular objects
  • console.time / timeEnd — simple benchmarks

Elements panel

Inspect live DOM, tweak CSS live, see box model—pairs with lessons from the CSS track.

Important interview questions and answers

  1. Q: Console vs printOutput here?
    A: printOutput is this site's panel; console also appears in DevTools when using a real browser tab.
  2. Q: Network tab use?
    A: Inspect fetch requests, status codes, and payloads.

Self-check

  1. Name three console methods.
  2. What does Elements panel show?

Tip: Re-run the playground code for devtools-console and tweak one line before the MCQs.

Interview prep

Network tab?

Inspect HTTP requests and responses.

Interview tip Lesson completion confidence

Can you explain this lesson in 30 seconds without reading notes?

Not saved yet.

Playground

Runs in your browser in a sandboxed frame. Backend runners appear when this track’s profile allows them.

Check yourself

Multiple choice — immediate feedback.

Discussion

Past discussion is visible to everyone. Only logged-in users can post comments and replies.

Starter discussion topics

  • What would you log to verify this behavior?
  • What breaks if you run this before the DOM is ready?

Sign up or log in to post comments and sync lesson progress across devices.

No discussion yet. Be the first to ask a question.

Jump

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36