VS Code: Supercharge Your JavaScript Debugging Workflow




This session shows how to supercharge your JavaScript debugging workflow when working with React, AngularJS, and Node in Visual Studio Code. We talk about debugging principles, workflows, and how to be more productive by staying inside your editor.

EVENT: Microsoft Build 2017

SPEAKER: Kenneth Auchenberg

PERMISSIONS: The original video was published on the Microsoft Visual Studio YouTube Channel with the Creative Commons Attribution license (reuse allowed).

ORIGINAL SOURCE: https://www.youtube.com/watch?v=-3Whcyf6pBE

Additional material for JavaScript learners:
https://amzn.to/2JrUINQ Eloquent JavaScript, 3rd Edition: A Modern Introduction to Programming
https://amzn.to/2HwAMYd Simplifying JavaScript: Writing Modern JavaScript with ES5, ES6, and Beyond
https://amzn.to/2Cq5bmL JavaScript: JavaScript Programming.A Step-by-Step Guide for Absolute Beginners
https://amzn.to/2uhIvAP How JavaScript Works
https://amzn.to/2CwS2bU The Modern JavaScript Collection

Original source


11 responses to “VS Code: Supercharge Your JavaScript Debugging Workflow”

  1. Cannot connect to runtime process, timeout after 10000 ms – (reason: Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:5858).

    What to do with this? What have you set in your "start" runtimeArgs? Facing hard times debugging a simple app. It sucks.

  2. I will definitely test this out. However console.log isn't the only way. You can also write debugger in your code to set break points. I find that, in combination with console log, to be pretty painless especially when you have HMR enabled. Great video though!

  3. what if they have babel-node… and a number of build process in front of it…. The idea of setting break point for node like in VS is quite naive… I tried it for a while and it simply not working. Still prefer console.log, simple and straight forward.

Leave a Reply