How to Debug Node JS Application Efficiently?
Any online project can occasionally experience sophisticated issues that require us to debug the backend code in order to grasp the situation. We may investigate these troubling scenarios using the debugging skill, and with the aid of this skill, we can accurately examine how each line of our code is processed. We can also investigate the values of the variable following the execution of a single instruction.
Developers frequently disregard debugging because it is a talent that is very undervalued. Your understanding of your code will be accurate thanks to this ability, which will also help you become a better developer and create code more efficiently. It’s not always a good idea to use console.log(), and it takes time to do so.
Moving on, let’s talk about how to debug Node.js applications.
Conditions to Debug NodeJs App in Visual Studio Code
Before you debug a Node Js application, you should be aware of the following:
- Basic understanding of node.js (Express)
Debug Node JS Application: A Step-by-Step Guide
Let’s go gradually to stay on the Node.js debug process.
Step 1: Create a Node.js Application
Starting with a straightforward Node.js application with a single endpoint, we next do some random things. Any Node.js project can be used.
As of right now, we only have a very simple application that filters objects from an array according to the type specified in the query parameters. Here is our primary JS file, called app.js.
The tasks are listed below. json document that contains an array of items (list of tasks).
The aforementioned express app example is a simple one in which tasks are listed and filtered. The endpoint for carrying out this process is as follows.
http://localhost:3000/all-tasks can be used to obtain all tasks.
the following URL will filter tasks by the specified type: all-tasks?taskType=personal
Let’s move on to the subsequent Node.js debugging phase.
Step 2: Setup Node.js Debugger With “Nodemon”
To debug a Node JS application, we are using nodemon. Let’s install Nodemon worldwide by running the following command:
After installing nodemon, use the following command to utilise nodemon to serve the node.js application:
This command will serve your application to a specified port, in this case 3000, thus the programme is running at http://localhost:3000. Here, app.js is the primary file of the Node.js application.
Let’s go on to the next step, which is to enable the debugging option in Visual Studio Code.
Step 3: Start debugger in VS code
You can now choose “Debug: Attach Node Process” by typing “Debug: Attach” into the search box. As soon as you click it, the following screen will appear:
Essentially click on the first of them, which are simply node processes that are active on your system, to reveal a debug controller that looks like this:
Now that the debugger is running, all that is left to do is add some breakpoints to cause the execution to halt there. However, before we go on to breakpoints, let’s first understand some fundamental concepts regarding the debugger and debug controller.
Basic Debug Controller Overview
The items in the debug controller are given numbers, which you can use to understand their functions. The debug controller is shown here:
Test the controller
The descriptions of each section are given below.
Play/pause: Used for start and pause debugging
Step In: It will help you to carry out step-by-step instructions if you want to carry out instructions line by line.
Step inside: This option allows you to dive deep into a function or statement and debug there as well. For example, if you are calling a function in the middle of the script, you can easily get into those functions as well.
Restart: the debugger from the beginning or the first breakpoint.
Disconnect: A command to halt debugging
Breakpoints are a crucial component of debugging since they show debuggers where to stop an execution. Set breakpoints in your code to connect to a debugger that halts execution here and records the values of executed variables.
The following is a screenshot showing a few breakpoints. Breakpoints can be applied by clicking the left side of the editor (left side of the line number column).
Now that you’ve put the breakpoint, the execution will halt here. Let’s start the debugger to check how things are going.
Step 4: Run Debugger with Breakpoint
To activate the debugger, adhere to steps 2 and 3. Let’s get to the endpoint where the code will be executed after the debugger has been activated.
You will get a screen similar to the one below whenever you reach the appropriate endpoint or execution starts for the code portion in which you have indicated the breakpoints:
When execution is terminated, it seems like this. This is comprehensive info while your code is being run line by line. To help you better grasp how to debug Node js applications, let’s explain these areas.
This section lists all the variables that were employed in the relevant code section. You can also view each variable’s corresponding value here. When execution for a variable is complete, you will see the variable’s real-time value, so you might see certain variables are undefined or null because of this.
Simply put, it is a history of every execution. For instance, you may examine every execution that took place prior to the present execution.
You can locate all the breakpoints you’ve added to the project in this section, which organises them all in one location.
The debugger and how to debug a Node.js app are covered in that. We hope that this blog will enable you to successfully troubleshoot Node JS. Do you need any Node.js application development, feel free to contact Nettyfy Technologies at any time.