Different ways to open Chrome DevTools #DevToolsTips

Let's take a guess - how many ways are there to open Chrome DevTools? Tell us your favorite ways in the comments below!

Chapters:
0:00 Intro
0:15 Keyboard shortcuts intro
0:31 Open the Elements panel
1:12 Open the Console
1:37 Open the last panel you used
2:22 UI navigation intro
2:30 Open with the 3-dot menu
2:42 Open with right click - inspect
2:50 Open with the top menu bar (MacOS only)
3:06 Open DevTools in every tab

Links:

Questions? Tweet to us:

#DevToolsTips #Chrome #Developer

[Mr.man]

Good video! Here from the Odin Project!

[berndeckenfels]

The Ctrl shift I to reload network panel is neat

[Kralnor]

Ctrl+Shift+C is my new favorite for inspecting styles

[firiasu]

Something wrong with you if you watching Jecelyn without a smile :)

[woolgathered]

Is your shirt’s little logo the Chrome dino? 😂😎

[franklemanschik_de]

My Most Loved way is --remote-debugging-pipe

[Biowitharnab]

I use F12 to open it
But will also use these shortcuts to open the same

[tabliqatchi]

I wish there was an extension that allowed opening devtools specific panels, e.g., the sources panel.

[mnlml]

I heard you speaking in French "and Voilà" and Italian "Ciao" 🙂 🙂

[pelic]

C-S-j, what else?
Wait, DevTools can do more than the JS console? Get out! I don't believe you. 😏😄

[dororo]

"I" for "my choice" XDDDD

[powerbit]

Thank you, but it's better to speak in a local dialect.

[opticalmouse]

Never heard of Maos operating system! Is it a new operating sitem?