Chrome DevTools tips & tricks

Chrome DevTools are incredibly useful for a frontend developer, sometimes we spend more time using them than our text editor of choice.

That's why it's so important to understand this tool better - those quick lessons will teach you things that will help you to become a more effective developer.

You will learn how to:

• Use (experimental) CSS Overview to learn all about CSS used on a page in a minute
• Style console.log messages with CSS - a crucial skill for any senior developer (j/k)
• Debug your code (on production and local environment) with logpoints
• Run a Lighthouse audit of your site
• Choose accessible colors for your website that have an AAA contrast ratio rating
• Force a DOM element state in Chrome DevTools
• Use Console utilities to make debugging easier
• Copy a network request as fetch or cURL with Chrome DevTools

Have fun!