A Software Application needs to be error-free before going out in the market. Customer satisfaction is of utmost importance for any organization; only a bug-free product can keep your customer happy. In this article, we will see what debugging is and my story of debugging as a developer.
Let's get started!
What is Debugging?
Software programs undergo heavy testing, updating, troubleshooting, and maintenance during the development process. Usually, the software contains errors and bugs, which are routinely removed. Debugging is the process of fixing a bug in the software.
It refers to identifying, analyzing and removing errors. This process begins after the software fails to execute properly and concludes by solving the problem and successfully testing the software. But, it is considered to be an extremely complex and tedious task because errors need to be resolved at all stages of debugging.
Why do we need debugging?
The process of debugging gets begins as soon as we start typing the code. Then, it continues to begin in successive stages of writing code to form a perfectly working software product. Debugging has many benefits such as:
It reports an error condition immediately. This allows earlier detection of an error and makes the process of software development stress-free and unproblematic.
It also provides maximum useful information on data structures and allows easy interpretation.
Debugging assists the developer in reducing useless and distracting information.
Through debugging developers can also save time and avoid complex testing code.
Now, let's see how you can get into a mindset of debugging in a better way!
How to get into debugging mindset?
First things first, pay attention to error messages, what does it says and where our code is getting wrong.
In almost every development environment, if your code fails, you'll be shown an error message that explains why your code is failing.
Let's take a basic code example:
console.log("Hello, World!);
Since the above line of code has a missing closing quote, running it throws a SyntaxError.
Uncaught SyntaxError: Invalid or unexpected token
And here, you can simply see that the at the end of the code closing quote is missing and it throws us a SyntaxError: Invalid or unexpected token. You quickly get back to the code and lookout the code once again and see that the quote is missing.
You see how with just a error message you get to solve the error.
Error messages are there for a reason, and this is to give us at least a first idea of where the problem is coming from.
If the error message you get isn't clear to you, or you can't figure out why you're getting it, a good first step would be to Google it. One of the many amazing things about coding is that the online community is huge. Almost surely there are tons of people already that have faced the same bug you're facing, and that have solved it and explained it so other people don't have to struggle with it, too.
Another good idea is trying to use trusted and recent sources. Trusted means either official documentation or solutions that have been validated by others. Recent means solutions that have been implemented as recently as possible, because something that worked five years ago may not the best way to solve the problem right now.
Official documentation always should be the first thing to check either when you're learning something new or dealing with an error.
Official docs are the most complete and updated source of information about the specific language/error. It sometimes may feel tedious or overwhelming to go through so much technical information, but in the long run I think it saves time.
Explain your code to others or rubber duck debugging
A good solution to this is to go through your code line by line, reading it and explaining it out loud as you go. The rubber duck technique is a popular way of doing it.
The idea is to force yourself to actually read your code instead of just assuming you know what it does. In this way you can check the logic in your mind versus what is actually happening in your code.
Steps involved in debugging
There are different stages involved in in the process of debugging, Let's look at them:
Identifying the error: A bad identification of error might lead to waste your time, It's important to identify your error first and they get on that error to solve it.
Finding the error location: It's very important to find the error location first at where exactly the error is coming and how we can get rid of it. Basically, in this stage you've to focus on finding the error rather than understanding it.
Analyzing the error: Next step after finding the error location is to understand the error. Like, where the error is causing and what is the error. This helps you in understanding the error. Analyzing a error has two main goals, such as checking around the error for other errors to be found, and to make sure about the risks of entering any collateral damage in the fix.
Prove the analysis: Once you are done with the analyzing of code, then you have to prove it. It simply means that, you have to work on the particular error and get it work.
Fix & Validate: The final stage is to fix the error and get it working.
If you try implementing these stages or debug like this. I'm sure that you'll be get rid of those errors quickly and without getting frustrated this is the right way of debugging your code.
Now, Let's get on my tale (My story) of getting stuck on solving a bug and my approach of getting rid of that bug.
My story of debugging
Once upon a time, I was working on a project for one of my clients. I remember I was working on developing their web app. And I suddenly got stuck in an error while running the development server. The error message was:
So, at this time I got an error and now first thing that I done was going through the code line-by-line until I found any error/doubt in the code. I still didn't find any solution by lookouting the code, then secondly I tried checking the documentation about the specific language as you and I both know that "6 hours of debugging can save you 5 minutes of reading documentation" but by checking the documentation I still wasn't able to find the fix/solutions about the error. Then as everyone does, I googled the error message but still by googling it took me an amount of time in finding the solutions and researching about why the error caused to me.
However, I still couldn't find the root cause of the problem. It was like I am getting onto the same place again and again even when I tried a different route. 🤔As time went on, I started getting more and more frustrated. I had been working on this for hours, and I still had no idea what was going on. I started to feel like I was wasting my time and getting nowhere.
At this moment, everyone thinks of quitting the project but it's not the right approach. Like, you've wasted hours on this then you've tried figuring out the solution for more hours. And you think like quitting this project, it's simply a waste of your time. But, instead of thinking of quitting the project what you can do is, ask for help from your friend, teammate, colleagues, etc, etc.. Or asking for help in online communities. Most of th time asking for help in online communities like on Discord gets the work done like a charm ✨
And here's where you're comeback happens, what you can do if the error is not solving by yourself then getting help by asking in online communities or your friends gets the work done. Just ask for help and tell them that I'm getting this kind of error and this is my code, what shall I do to get it solved? Done, that's it you've to do.
Most of the time, I've tried this thing and it gets worked fast. And these online communities do consist of your and my favorite Stackoverflow. Stackoverflow is also another community that provides plenty of solutions to your errors. Just search for your error and get different solutions on it, Just tryout those solutions and work on it.
Solution to the error
Alright, let's get back to the story so then when I tried asking for help in online communities this time I got the solutions to the error from Stackoverflow, here's a breakthrough the error I was getting and the solution to it.
The Cannot read property '<property>' of undefined error is thrown when you try to access a property of an undefined value. This typically happens when you try to access a property of a variable that hasn't been assigned a value.
In general, this error occurs when you are trying to access a value that is undefined, either because it was never assigned a value, or because it was explicitly set to undefined.
Here's an example of how this error could be thrown:
// Define a variable, but don't give it a value
let user;
// Try to access a property of the variable
console.log(user.name); // Throws 'Cannot read property 'name' of undefined'
To fix this error, you need to make sure that the variable has been assigned a value before you try to access its properties. You can do this by either assigning a value to the variable when you declare it, or by assigning a value to it later in your code.
// Define a variable with a default value
let user = { name: 'John Doe' };
// Access the property of the variable
console.log(user.name); // Outputs: 'John Doe'
Alternatively, you could check if the variable is undefined before you try to access its properties, like this:
// Define a variable, but don't give it a value
let user;
// Check if the variable is defined before accessing its properties
if (typeof user !== 'undefined') {
console.log(user.name);
} else {
console.log('user is not defined');
}
And when I followed the steps from one of the StackOverflow solutions you know what? It worked! ⚡👀
Conclusion
Wow, that was quite an adventure! Debugging any code can be tough, but it's also really rewarding when you finally figure out what's going on. I hope you guys enjoyed my story and learned something from it.
Don't write better error messages, write code that doesn't need them!
Let's stay connected, make sure to follow me on Twitter, LinkedIn and Instagram.
- Happy Coding! 👨💻