DEV Community

loading...
Cover image for JavaScript Developer Tools

JavaScript Developer Tools

bello profile image Bello Updated on ・2 min read
This article is sponsored by Hostgator - Get Started today for $0.99

Errors in the browser are not visible to developers. But there's one specific tool that developers use to debug Javascript errors called the console.

How to Open the Console

developer-tool.gif

To open a ready-made developer environment or console, use either of the following keyboard short cut.

  • Ctrl + Shift + I (Chrome and Firefox)
  • F12 (Chrome and Firefox)
  • Ctrl + Shift + J (Chrome)
  • Cmd + Opt + J for Mac (Chrome)
  • Ctrl + Shift + K (Firefox)
  • Cmd + Opt + K for Mac (Firefox)
  • Preference - Advanced - click the check box at the bottom (Show Developer menu in menu bar) - Cmd+ Opt+ C for Mac (Safari)

To insert multiple lines on the console, press Shift + Enter. And click Enter to execute the code.

Besides the tedious entering of the Shift + Enter keyboard shortcut to escape a new line, whenever a variable, function, etc was declared from a previous program, it gets cached in the browser console. This means anytime the same declared variable is used (even after clearing the console Ctrl + L), an error message is printed out in the console (except the browser is refreshed Ctrl + R).

These issues are prevented by making use of a reliable text editor like Visual Studio Code.

Happy Coding!!!


Buy me a Coffee


Techstack | Hostgator

Techstack article is sponsored by Hostgator.

  • A ton of website hosting options
  • 99.9% uptime guarantee
  • Free SSL certificate
  • Easy WordPress installs
  • A free domain for a year

Learn more

Discussion (0)

pic
Editor guide