This tutorial on the left, and the demo on the right.įocus the demo and then press Control+ Shift+ J or Command+ Option+ J (Mac) to open DevTools. Optional: Move the demo to a separate window.įigure 2. When you physically follow along, you're more likely to remember the workflows later. This tutorial is designed so that you can open up the demo and try all the workflows yourself. It assumes that you understand the fundamentals of web development, such as how to use JavaScript to add interactivity to a page. This tutorial is intended to be completed in order. This interactive tutorial shows you how to log and filter messages in the Chrome DevTools Console.