What do you use to debug your JavaScript while solving freeCodeCamp challenges?

JavaScript
1

Hi everyone,

I’m enjoying freeCodeCamp very much, especially the last month or so when I started javascript. When I have difficulty with a particular challenge, I’ve been opening up a blank tab in Chrome and using the developer tools to paste in my javascript and debug the code. it works ok, but I’m wondering what others use? I have a sense/hope that is a better alternative.

for example, I’m on Basic Data Structures: iterate through the items in an array link ).

Taking me a bit to work through and wanted to ask this question. thanks in advance for any suggestions!

2

I always recommend chrome dev tools snippets.
https://developers.google.com/web/tools/chrome-devtools/javascript/snippets

https://repl.it is nice too.

Of course you could always use node or a local web server but I use snippets all the time for challenges and experimenting.

1 Like
3

I’d be interested in seeing the replies you get.
I do the same, Chrome and developer tools and repl.it but lately I’ve been finding it easier to use repl.it because I can type a lot faster, comment out one section or piece that’s working and then just put in another and see immediate results. Plus, with repl.it I can keep it and come back to it later.

4

Thanks - giving this a try right now and its a big improvement from just using the console. thx!

have never used repl.it either

5

I have a tip for using snippets.

If you write a variable or function and run the script twice you will see you get an error saying that variable is already declared because you are working in the global scope of the tab you are currently in.

You can just wrap everything in the snippet inside an IIFE (Immediately Invoked Function Expression) to avoid polluting the global scope and then you can run the script over and over.

(()=>{
  const greeting = 'hello';
  return greeting;
})()

You also get the benefit of the devtools debugger, I don’t think replit has that feature.

1 Like