Today I went over debugging again which was in better detail this time around. Compared to w3schools this one was a lot more in depth with graphics.
The debugging process doesn’t look too difficult however it isn’t just memorizing a syntax. Here are the basic things to look for, which can be found in Google Chrome (F12 on Windows/Linux) and most browsers.
- The Source zone shows the source code.
- The Information and control zone is for debugging, we’ll explore it soon.
Those are just visuals to get familiar with the debugging screen. The way to find bugs in the code is by pausing the script. You can pause the script by using the debugger statement or by using a break point.
Learning about break points started to click. They are beneficial to limit the amount of code you have to examine for changes to be made.<div class='sharedaddy sd-block sd-like jetpack-likes-widget-wrapper jetpack-likes-widget-unloaded' id='like-post-wrapper-155635758-196-5d076eb34db26' data-src='https://widgets.wp.com/likes/#blog_id=155635758&post_id=196&origin=trilamanila.com&obj_id=155635758-196-5d076eb34db26' data-name='like-post-frame-155635758-196-5d076eb34db26'><h3 class="sd-title">Like this:</h3><div class='likes-widget-placeholder post-likes-widget-placeholder' style='height: 55px;'><span class='button'><span>Like</span></span> <span class="loading">Loading...</span></div><span class='sd-text-color'></span><a class='sd-link-color'></a></div>