![]() Why you should use a real debugger instead of console.log()īack when I was a mid level engineer, learning how to use a debugger supercharged my productivity. You don’t need to be a node expert to do debugging, beginner level knowledge is all thats required. Install it by navigating to the extensions pane and searching for: debugger for chrome.This tutorial will show you how to debug a NodeJS express app using Visual Studio Code. To get VSCode and Chrome communicating with each other we need to install an extension called Debugger for Chrome. Instead of using Chrome’s developer tools you can use VSCode to debug browser code. This is the same debugger protocol that Chrome’s developer tools use. VSCode connects to Chrome through Chrome’s debugger protocol. Next up we need to install the VSCode extension so it knows how to talk to Chrome. This will create a new directory that contains the new React application. Once installed create a new project by running create-react-app vscode-tutorial.Install create-react-app globally by running npm i -g create-react-app.Alternatively if you have an existing application you can use that. I use create-react-app a lot of the time because I hate writing boilerplate. You will learn how to hook up VSCode and Chrome so you can debug browser code directly from VSCode □ Setup the Test Projectīefore we begin with the tutorial we need to create a test application that we’ll use later in the article. In this guide I will show you how to supercharge your React workflow with Visual Studio Code’s debugging features. ![]() Gone are the days where I spend my time bouncing back and forth between the terminal, browser and editor. VSCode debugging tools and Facebook’s Jest ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |