Visual studio code js debugger how to#
Visual studio code js debugger install#

Now that we now our problem, let’s stop the debugger and fix it. Our body has a users attribute, but we try to destructure a user variable from it in line 15, which leads to an error when we try to write to user.id in line 16. When we look into the side-bar in the VARIABLES/Block category, we can see that our user object is in fact undefined! If we open the VARIABLES/Local category, we can also see why.

Then re-send the request with cURL to see what happened before we tried to set user.id. Let’s open our index.js again, move the break-point to line 16 and let the debugger run to the end of the event loop by pressing F5. It seems like we created an error by setting the id of our user object, how did this happen? Somehow we ended up in a whole different place of the codebase? Let’s step to the next line with F10 to see what happens. Let’s open Local and see what’s inside.Īs we can see, we have two local variables, body which is of type Object and response which is of type ServerResponse. If we look at the sidebar on the left of our code, we can see a VARIABLES category with various sub-categories like Block and Local. This request will run the function linked to POST /users and halt at the breakpoint in its first line.

Visual studio code js debugger install#

API Setupįirst, we create a new Node js project and install our dependencies.Ĭonst express = require ( ' express ' ) const bodyParser = require ( ' body-parser ' ) const users = [' localhost:9999/users You can then go on to easily add API endpoints and make an API call. We will create a simple API with the Express framework and then try to debug it with the help of VS Code’s debugging features instead of the console. We will also use cURL to send requests to our API. Visual Studio Code is a “streamlined code editor with support for development operations like debugging, task running and version control.” It allows us to link functions directly to API endpoints, which is a quick and simple way to build an API. WhatĮxpress is a “minimalist web framework for Nodejs”. This can be faster when you exactly know what the issue is, but it will most likely take longer if thats not the case.

Visual studio code js debugger how to#

There are many guides out there for finding the best node js bootcamp, but in this tutorial we’ll learn how to debug an Express-based API with the help of Visual Studio Code, or VS Code for short. A guide to debugging JavaScript in Visual Studio Code FebruEvery time Im tracing a bug, Im tempted to throw in a console.log () to check some variables. Node js is a cross platform and open source JavaScript runtime environment that allows the JavaScript to be run on the server-side.

In JavaScript, the first stop for a debugging task is often logging to the console, but using a debugger can give us a more integrated experience. API creation isn’t exempt from this fact, so sooner or later we’ll need to debug it. Try stepping through the code and stepping into methods.When we create software, we rarely do it without errors. You can interact with it much like you would the debugger in your browser’s console. Visual Studio should now be in debug mode, paused on the breakpoint. Using Postman or your browser, send a request to the endpoint where you put the breakpoint (using the appropriate request method). Select “nodemon” from the config dropdown. (If you’re not sure where to start, try the first line of your route method.) If you haven’t already, go into your application code and set a breakpoint. You’re now able to run your Node app with the debugger. Make any adjustments needed – in this case I need to change the value of 'program': '$/server.js' Select “Nodemon” (or whatever you are using to run the Node server) Go to the Debug section of Visual Studio.Ĭlick the dropdown near the green “run” arrow and select “Add Configuration…” In this example, I’ll assume you are starting your server process with nodemon, but the steps are similar if you run the server some other way–just make sure you choose the correct config options.

If requests to a given endpoint are not behaving as expected, this is a good way to start fixing the problem.

You can use Visual Studio’s debugging features not just to debug a particular script, but to set breakpoints while your Node.js application is running.