Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
1×
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.

Autoplay

    Make Console Logging in VS Code 10x Easier with Turbo Console Log

    Steven MercatanteSteven Mercatante
    vscodeVS Code

    The Turbo Console Log extension lets us quickly add console.log statements with additional data, which makes debugging your code easier.

    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Discuss

    Discuss

    Transcript

    Transcript

    Steven Mercatante: Start by searching for turbo console log and install it. I've got a demo file here with some test variables, a test function, and a test class. The easiest way to use turbo console logger is to log individual variables.

    Select the variable, and then hit CTRL+ALT+L. You see that a console log statement is automatically added for us. It includes the name of the variable, the variable itself, and this TCL prefix, which stands for turbo console logger.

    We can also log multiple variables at once. We select both of these, and again hit CTRL+ALT+L. We instantly have our log statements. A cool feature of this extension is that it can also tell you the name of the function or the class that contains the variable that you're logging. Let's test it on the greet function.

    You'll notice that we still have the TCL prefix, but the log also tells us the function that was this called from and the variable name itself. We can do the same thing for the class properties. Select both of them, and again, hit CTRL+ALT+L. This time, we have the TCL prefix, the name of the class, the name of the method, and then finally, the name of the property itself.

    This is great for debugging, but at some point, all these messages do become noisy. You can comment all of them out at once by pressing ALT+SHIFT+C. You can uncomment these by using ALT+SHIFT+U. You can also delete all of them using ALT+SHIFT+D.

    You can also change the prefix from TCL to whatever you want by going into the settings. Look for turbo console log-log message prefix and change this to whatever you want. I'll use three hashes. Come back to our demo file, and select some variables. You'll notice here that we've got our custom prefix.