Overview and Console Hi, this is John Sonmez from Pluralsight, and welcome to this course on Chrome dev tools. Most web developers and Chrome users are at least somewhat familiar with Chrome's developer tools. But not many developers take the time to really learn how to use the tools. This course is aimed at giving you a comprehensive look at all of the major features of the Chrome dev tools and showing you step by step how to use each tool. By the end of this course, you should feel pretty comfortable using the Chrome dev tools and have a good idea of what exactly each of those tabs on the Chrome dev tools toolbar does and how to use them.
Elements Panel Hi, this is John Sonmez, from Pluralsight, and in this module, we'll be going over the elements panel. Most developers that use the Chrome Developer Tools have at least seen the elements panel, but you won't want to skip this module, because we'll be going in-depth, and learning about some tips and tricks that you might not be aware of. Learning the tricks of the elements panel can save you time in getting your design just right, and troubleshooting tricky layout issues. In this module, you'll learn everything you need to know to start using the elements panel like a pro.
Resources And Network Panels Hi, this is John Sonmez from Pluralsight, and this module we'll will be digging into HTML5 features as we explore the Resources panel and checking out exactly how resources are being loaded in the Network panel. We'll be learning some good techniques for determining exactly what data is being used in your web pages as we check out the Resources panel. And even though we won't be digging into the specifics of HTML5 features like IndexedDB and local storage, we'll see how the Chrome DevTools allows us to see exactly what data is being stored without having to write debugging code to get that data. We'll also learn how to make sense of all the data in the Network panel in order to figure out exactly what data is coming over the network and how long it's taking to get there.
Timeline And Profiles Panels Hi this is John Sonmez from Pluralsight, and in this module we'll be wrapping up our coverage of the Chrome developer tools as we tackle the two most difficult panels, the timeline and profiles panels. These panels can be used in conjunction to really help us fine tune our web pages, and find out exactly what is happening inside the browser. The only problem is both of these panels can be a bit difficult to use, because they contain so much data, and what all that data is is not always apparent. Don't worry, though. I'll be giving you the best bang for your buck as I show you the things you should know about these panels that will benefit you the greatest, without requiring a degree in memory management.