Introduction to Google Chrome Dev Tools

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

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

Enter Chrome Developer Tools. It seems that every time I look, this little window in Chrome gets more and more features that save me time and headaches debugging, testing and optimizing my web pages. Whether I’m stepping through JavaScript, Debugging CSS, Testing REST API calls, or auditing page performance, Chrome’s Developer Tools are there to help. In this session, I’ll share with you some of the features that have made this tool an essential part of my toolbox. I’ll show you how how to diagnose a page’s performance issues, audit a page for accessibility, review page security,inspect calls made to the REST API, and more.

Speaker

WordCamp Calgary 2018 is over. Check out the next edition!