Best things to know about debugging code.
Tags: codenewbie, webdev, javascript
Published: 2021-04-12 00:22:30

Debugging is the process of identifying errors in your code the prevent your code from running in the way that you assume and we refer to diagnosed problem code as a *bug*. 

> Fun Fact: In 1947, Grace Hopper recorded the first known bug after discovering an actual moth in a relay that caused the Harvard Mark II computer to fail to process. 

These errors can be of many different types and can derive from introducing new code in an unsuspecting way. Here is a list of debugging techniques to help resolve bugs in your code. 

### Value the error output 

After introducing a new bug into your code and running your code you will receive some error output in the console. This output can initially be very scary but the truth is it's super helpful to resolve your bug. It will help to identify the type of bug and where it has been detected in your code. 

```
// This error code points to a variable that is referenced incorrectly

ReferenceError: i is not defined 
    at Object.<anonymous> (/Users/code/file.js:5:15)

// This error line points to line 5 of code in file.js where the error was found in execution => ex: file.js:5:15 

at Object.<anonymous> (/Users/code/file.js:5:15)
```

### Re-Read your code 

The next best plan of action is to re-reread your code in the area where the bug has been identified. Quite often a bug is introduced by a simple syntax error that can be corrected with a quick review of the code you recently wrote. 

### Test new inputs 

The is a great opportunity to test the sanity of inputs in the functions of your code. Try new inputs to see if they will reproduce the same errors. 

### Print statements 

You can use print statements in your code like console.log() to reveal return values in your code that are otherwise hidden in implementation. 

### Use breakpoints or run lines of code one by one

One great practice of programming is to frequently run code after short stints to find out what your code is doing maybe after each function you create. The javascript language has a keyword called *debugger* that you can place in your code to step through every line of your code after the debugger declaration. 

### Find debugger tools 

Each language has helping debugger tools that are available in the ecosystem. In javascript, most modern browsers have a debugger tool bundled in to closely examine many variables in your code to observe errors. My personal favorite is the Chrome debugger tools for any of my web development projects.

### Split up your code 

Break up your code into smaller parts in order to better zero in on problem errors in your code. 

learn this technique: [single-responsibility principle](https://stackify.com/solid-design-principles/)

### Take a break

After too much deep work and difficult problem solving, your brain tends to get bogged down, and bogged down brains introduce bugs plus make it hard to recognize bugs. Take a break from looking at your screen and take a walk so you can return with a fresh perspective. 

### Automate with testing frameworks 

The best defense is a good offense. For several languages, there exist automated testing frameworks that prevent many bugs in your code by providing a chance to write tests that provide expected outputs for units of code and domain-specific language to guide you to writing bug-free code. 

### Share your problem

After struggling with bugs for too long, the best course of action is to seek help from a community that can provide a second set of eyes and a new perspective. This can include a pair-programmer with a friend/co-worker, posting code in a forum like StackOverflow, or solicit advice from any group of people with experience with similar coding bugs. 

### Let's chat about debugging
These are great tips to get you started locating and squashing bugs in your code. I hope this helps you to save tons of development time. If you enjoyed this post feel free to leave a comment about your thoughts and experiences debugging your code.

Happy Coding,
Terry Threatt