Debugging web applications can be tricky. Accessing your browser’s developer console is the easiest way to “pop the hood” and see what’s going on with your application. It’s like a secret backdoor that isn’t very secret.
Google’s browser is one of the most popular out there, and it’s easy to access the developer console:
In the upper right hand corner of the browser, click the 3 dots:
Then select More Tools -> then Developer Tools
You will now see the console (and all the errors my site produces when I run it locally)
MacOS: Option + ⌘ + J Windows / Linux: Shift + CTRL + J
In Safari you’ll need to enable Developer mode. Go to the
Select Safari Menu > Preferences and make sure “Show Develop menu in menu bar” is checked:
Now you’ll see a developer option on the Safari menu bar:
And now you’ll see a web console in Safari:
Option + ⌘ + C
In Edge, again click the three dots in the upper right hand corner:
Select More Tools -> Developer Tools
And you’ll see a lovely console which hopefully doesn’t look like Bing’s:
In Internet Explorer click on the gear icon at the upper right hand corner of the browser:
Select “F12 Developer Tools” (or, ya know, press F12)
And your console appears:
In Firefox you’ll have a sandwich menu in the top right hand corner:
Clic that and select Web Developer -> Web Console
And your console appears!
MacOS: Shift + ⌘ + J Windows / Linux: Shift + CTRL + J
Questions, comments? Let me know!