Adam. R

5 VSCODE Extensions for JavaScript Develeopers!

Created March 30, 2022

Introduction

Recently, I have done a post similar to this one, but on PHP. So, I think now I should JavaScript now! Let's get straight into the extensions.


List

1. JavaScript (ES6) Code Snippets

JavaScript ES6 is the most common type of JavaScript used right now. This extension contains code snippets for JavaScript in ES6 syntax for VSCode (supports both JavaScript and TypeScript). It supports more than just JavaScript and TypeScript with more languages like JS React (.jsx), TS React (.tsx), Vue (.vue), and HTML (.html). Some types of snippets this extension has is Various Methods, Class Helpers, Console Methods, and Import & Export.

Link: JavaScript (ES6) Code Snippets

2. JavaScript Debugger

This one is pretty simple. This extension is a JS Debugger. The debugger is highly configurable. This can also act as a tester. With lots of information on how to fix the code error and give you live reports of the testing. This is a really powerful tool!

Link: JavaScript Debugger

3.ESLint

ESList is one of the most popular and beloved extensions among JS developers, without a doubt. The extension runs ESLint rules on your code and integrates the result within the editor. It allows you to detect and quickly fix rule invalidations. It’s a must-have for all JS developers as it helps improve productivity and the quality of the code.

Link: ESLint

4. Quokka.js

Quokka.js provides rapid JavaScript prototyping in your VS Code editor. It is a live playground for JavaScript and TypeScript. It is often called the modern-day scratchpad for JS developers.

Have you ever wanted to try something quick, and you end up on your browser’s console to run some JS? Or do you start the node process on a terminal and try it there? This extension’s primary purpose is to run code fast and conveniently right there in your VS Code editor.

Link: Quokka.js

5. Debugger for Chrome

Debugging JavaScript can be painful. Chrome and other browsers offer amazing tools that help you with the job. Still, they are often hard to work with or don’t provide a great experience overall, especially when working with frameworks and many libraries.

Debugger for Chrome is an extension developed by Microsoft that seamlessly helps you debug your code for every small change. Debugger for Chrome console is pretty powerful when it comes to discovering which lines and functions occur the error came from, up to seeing its data handling.

Run your code on Chrome, debug on your code editor.

Link: Debugger for Chrome


Conclusion

If you found this useful then please share this and follow me! Also check out Buy Me A Coffee if you want to support me on a new level!

Buy Me A Coffee how2ubuntu