Debugging Like a Boss: A Developer's Guide to Great Debugging Experience

Every developer has, at one point or another, battled a bug. The good ’ol console.log works! But sometimes we neglect other awesome ways to debug our apps. In this session, we’ll be shedding light on myriad better debugging tips, focused on JavaScript tech stacks.

Transcript

1. Debugging Like a Boss A DEVELOPER' S GUI DE TO GREAT DEBUGGI NG EXPERIENCE GI FT EGWUENU lauragift21
2. - Likely a fairy tale Imagine a world exists where your code works without errors and there's never anything as a bug lauragift21 - Real life scenario We encounter bugs and errors daily as developers, how we fix these problems matters
3. Isn’t every developer go to method for debugging console.log() ? It'll be great to discover other ways of debugging with JavaScript lauragift21
4. Procedure for Debugging lauragift21
5. Procedure for Debugging Identify the bug lauragift21
6. Procedure for Debugging Identify the bug Reproduce the bug lauragift21
7. Procedure for Debugging Identify the bug Reproduce the bug Find Possible Fix lauragift21
8. Procedure for Debugging Identify the bug Reproduce the bug Find Possible Fix Test and Document your solution. lauragift21
9. Console Statements Step Up Your Debugging Skills lauragift21 Browser Developer Tools IDE
10. Console Statements lauragift21 Console.table() Console.time() & Console.timeEnd()
11. lauragift21 Console.table()
12. lauragift21 Console.time() & Console.timeEnd
13. Browser Developer Tools lauragift21 Debugger Black Boxing Breakpoints
14. lauragift21 Debugger
15. A breakpoint is set wherever you want to pause a debugger execution Breakpoints
16. Blackboxing gives you a first-class way to denote library (or other abstraction) code so that the debugger can route around it A cool way to ignore library internals when debugging Black Boxing
17. IDE lauragift21 Debugger for Chrome Extension VS Code, Web Storm, Atom Debug your JavaScript code running in Google Chrome from VS Code.
18. lauragift21 Debugger for Chrome Extension with VS Code
19. lauragift21 Chrome Developer Tools Extension with VS Code
20. lauragift21 Chrome Developer Tools Extension with VS Code
21. OVERVIEW OF DEBUGGING DEBUGGING PROCEDURES METHODS FOR DEBUGGING Talk through what debugging is all about and explain the process of debugging IDENTITY THE BUG REPRODUCE THE BUG FIX THE BUG TEST AND DOCUMEMNT THE FIX CONSOLE STATEMENTS DEVELOPER TOOLS IDE Round Up lauragift21
22. Thank You! Slides: bit.ly/debugging-talk lauragift21