Categories

There are currently no items in your shopping cart.

User Panel

Forgot your password?.

Learning Chrome Web Developer Tools

Video Introducing this tutorial

Introduction

Welcome
What you should know
Exercise files

1. Environment Setup

Visual Studio Code, Chrome, and http-server

2. Developer Tools Introduction

Access and use Chrome Developer Tools
Customize the display of Developer Tools

3. Using the Elements Panel

Inspect elements
Inspect styles
Use persistence to save changes

4. Using the Console Panel

View Console messages
Log information to the Console
Use the Console command line

5. Using the Sources Panel

Open files in the developer tools
Work with breakpoints and the call stack

6. Using the Network Panel

View HTTP request and response headers
Identify items that slow page loading
Emulate mobile connections

Conclusion

Next steps