Great VSCode extensions for web developers

Júlio Xavier
Entria
Published in
2 min readJul 23, 2018
Photo by Nathan Dumlao on Unsplash

Hello! My name is Júlio Xavier and I'm a FullStack JS Developer at Entria The Tech Team.

I'm always looking for ways to be more productive and effective, because what really matters isn't the time you spent working, but the results and the value delivered.

“Focus on being productive instead of busy.” ~ Tim Ferriss

Thinking about this, today I bring some extensions that help me to optimize my time, work in a team and make coding easier.

Turbo Console Log

This extension automates the operation of writing meaningful log message. Instead of typing all the command with the message and the parameter, you can just select a variable (or not) and press control + option + L on Mac or Ctrl + Alt + I for Linux/Windows users and that's it!

You will have a result like:

console.log('YourClass -> yourFunction -> variable', variable);

This will help you a lot when debugging!

Auto Close Tag and Auto Rename Tag

These two will help you with HTML/XML tags, making VSCode more similar to Visual Studio IDE and optimizing your time.

Opening a tag? When you type the closing bracket automatically a closing tag will be added.

Editing a tag name? The correspondent tag will be edited too.

Open in Github

That's interesting so you can share and reference a Code more easily, just opening you Command Palette and choosing "Open in Github" this will open instantly in your browser the file on Github with the selected line in the right branch.

VS Live Share

As last but not least, very well known, this extension enables you to enable collaborative editing, debugging, and more in real-time easily.

With just a click you get a link that enables others to start navigating and editing your files instantly, and that's just great in moments where do you need some help.

More resources

Here you can see some Entria The Tech Team open source code, we work mostly with React, React Native, Relay, GraphQL, Node.js and Koa.

Here's, for instance, a great git guideline that you can use to improve your team workflow.

That's all, folks. Hope that this extensions help you to be more productive in you day-to-day.

Any question, suggestions or just want to share with me an extension that you use? I will be glad to test it!

--

--

Júlio Xavier
Entria
Writer for

Fullstack JS Developer at Turtle AI. Working with startups from all over the world. In love with coding and self-improvement.