![]() You can open DevTools by pressing the F12 Key, or using a shortcut: either Control+Shift+I (Windows, Linux) or Command+Option+I (Mac). But the one we’re interested in right now is the Sources panel, which helps us in debugging JavaScript. Know about the Sources panelĭevTools provides a lot of different tools to perform debugging tasks, including DOM inspection, profiling and network call inspection. ![]() You can also clone the app code from GitHub and run it locally. If you want to try out the tips provided below, you can find the Greet Me app at. Thankfully, Chrome DevTools will enable us to identify the issue. The greeting message doesn’t print the wish part correctly. Figure 1: The Greet Me app showing an errorīut wait, there’s a problem here. This JavaScript app asks for your name and invites you to submit a ‘wish’, which will be used to deliver your own personalized greeting. So once we’ve learned how to use the debugging tool for one browser, it’s easy to use for another. One of the great things about using DevTools is that browser vendors (like Firefox and Microsoft) provide their own tools to debug a JavaScript application, and they work in a similar way. So in this article, we will learn how to use Google Chrome developer tools (also known as DevTools) to debug any JavaScript application effortlessly. JavaScript has the famous console.log() method for that.īut while log statements are good, they are less efficient than a tool that enables you to carry out step-by-step debugging. As developers, we’ve traditionally rooted out errors in our programs (we’ll call them bugs from now on if that’s ok) by using meaningful log statements.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |