Profiling a nodejs app from the chrome dev tools

Debug a NodeJS App in Chrome Dev Tools

Benchmark http requests using autocannonjs

Nodejs

In this lesson we will learn how to see your node server's code in chrome dev tools and also to add debug points to debug your nodejs app easily.

Yonatan Kra: [0:01] This is a simple Express app. It exposes a POST search API. Then it serves a static website. We can start the web server by calling Node with file name. Now that the server is started, let's query the server from the UI. We got 1,000 results and everything is working.

[0:25] I'll kill the server. Now we will start the server with the same command, but this time we will add the inspect flag. It's node --inspect and the file name. Node started the debugger and opened socket connection. In the developer tools we now have the Node.js icon at the top. Clicking the Node.js icon will open a special Node.js dev tool.

[0:49] We can now see the logs from the server just like any front-end app. We can also inspect the source code of the Node.js app by going to the Sources tab. We can search for the file by using control-P, and looking at the index file we can now add back points where we want.

[1:07] Let's head back to the app and initiate a new search. Our debug point was activated, and we can now debug our Node.js app inside the browser.

Course

Nodejs

Debug a NodeJS App in Chrome Dev Tools

Share this video with your friends