How to debug – Debugging Tips for Beginners 1.5k Views Wednesday July 22, 2020 | Filip Kunjadić - Ćulibrk

How to debug – Debugging Tips for Beginners

Debugging is a daunting thing to do if you are a beginner developer! So here I am going to tell you about methods that I use to debug my code! Depending on what you are trying to debug you may or may not be able to use these methods. For example, you can't "print" your HTML code but you can "print" your JavaScript or PHP variable. Please keep that in mind. If you are not yet a developer, but planning on becoming one and now you are just exploring all the options and informing your self - I have written an article just for you How to become a web developer!

1. Print your variable

One of the best debugging tips in my opinion. Printing your variable may seem like the obvious thing to do. But many people forget about these simple methods. Before you start searching the internet in a quest for the best debugging tool - remember: the simplest methods are usually the best! 

$awesomeVariable = $this->awesomeFunction();
var_dump($awesomeVariable);

2. Use comments as a debugging method

If you are new to coding, you are probably unsure about git, or you don't use it yet. If you are not using it that is fine - we all had to start somewhere. But if you are just getting started, how could you trust it if you are not very skilled when it comes to using it?

This is where comments are becoming handy. If you have the line of code that works and you want to modify that line what do you do? Well, you just modify it - correct? And what happens if you modify it a lot of times and "undo" doesn't remember your original line... That is why you can always copy the line and comment it out and safely continue working with the exact same line without fear of losing your code! 

// THIS LINE WORKS
// $awesome = $this->becomeAwesome()->startNow();

// THIS DOESN'T
$awesome = $this->becomeAwesome()->startNow()->endNever();

3. Read the error message

And now you are thinking, of course, I do read the error message. But - do you actually? Sometimes people read just the beginning of the message or the end of it if the message is long and then they don't understand what when wrong. And of course "where" it went wrong. Take this error message for example.

Do not underestimate the power of the error message, it often directs you in the right way - your job is to dig a bit deeper and resolve the issue.

4. Use multiple checkpoints

When I say "use multiple checkpoints" I mean exactly that. If you are using a function that is failing, start breaking your code at the first line of that exact function. Go to a file where it is defined and print the input parameters - that should be the first thing to do. Make sure that your function is getting correct input, and then go step by step through it. You would be amazed at how many times functions are not getting proper input and failing.

function awesomeGenerator($names, $amount){
    var_dump($names);
    var_dump($amount);
    // ...other code
    // check if something above has changed variable
    var_dump($names);
    foreach($names as $id => $name){
    // .. rest of the function
}

In the example above, you can clearly see that variable named $names should be an array. And if these functions were to receive a string or something else instead of an array it would fail.

5. Check if someone already solved your problem

If you are facing any issue while coding, you can usually find some else's code that is similar to the code that you actually need. And you should use that code as a reference point. Try and see if that code works. If it does, break it apart and compare it to your own code - but remember. Always test the code that you are copying - don't spend hours trying just to find out that code that you have copied doesn't actually work. This has happened to me a couple of times when I was a junior developer. Learn from my mistakes.

6. Learn how to define error on google

This is of the things that make us developers - to be completely honest. This is the core itself when it comes to learning how to debug. If you define your answer on google correctly it is most likely that you will get the answer that you were looking for. Of course, I am not talking about specific languages or problems that are rarely used. For those, it is quite hard to google an answer.

Don't just copy and paste the error. Remove unnecessary parts of it like your username, or part of the file path (if the path contains your machine username). This can often direct you in the right direction helping you to solve your issue. But if you add too much irrelevant information to your question, you will often end up with results that have nothing to do with your error.

7. Use debug tools

If you are coding JavaScript - Google Chrome has an excellent JS debugger. The only thing that you need to do is to open developers' tools and navigate to sources. You can find your scripts on the left and you can easily add breakpoints to them. It is as easy as that!