Developing on the Front End Chrome Developer Tools

Are you debugging your JavaScript by writing console.log statements – the front end equivalent of using “echo” or “var_dump” in PHP?

As primarily a back-end developer, Shawn was accustomed to using XDEBUG as part of his workflow, but often fell back on rudimentary debugging skills when it came to debugging JavaScript or diagnosing performance issues from the front end.

Then entered the Chrome Developer Tools. It seems that every time we look, this little window in Chrome gets more and more features that save time and headaches in debugging, testing, and optimizing web pages.

Whether we are stepping through JavaScript, Debugging CSS, Testing REST API calls, or auditing page performance, Chrome’s Developer Tools are there to help. In this session, Shawn will share some of the features that have made this tool an essential part of his toolbox.

What You’ll Learn

• How to diagnose a page’s performance issues
• How to audit a page for accessibility
• How to review page security
• How to inspect calls made to the REST API
• And more!