29/07/2022, 07:53 JavaScript Code Editors
JavaScript Code Editors
If this JavaScript tutorial saves you
hours of work, please whitelist it in
your ad blocker 😭 and
Donate Now
(https://www.javascripttutorial.net/donation/)
to support us ❤️in paying for web
hosting and CDN to keep the site
running.
Summary: in this tutorial, you will learn about JavaScript code editors and how to install the Visual
Studio Code for coding JavaScript.
Popular JavaScript Code Editors
To edit JavaScript source code, you need a plain text editor such as Notepad on Windows. However, to
simplify and speed up typing of JavaScript code, you need a JavaScript code editor.
Besides basic editing features, a JavaScript code editor provides you with syntax highlighting,
indentation, autocomplete, and brace matching functionality. Some editors also allow you to debug
JavaScript.
The following are some popular JavaScript code editors:
Visual Studio Code (https://code.visualstudio.com/)
Atom (https://atom.io/)
Notepad++ (https://notepad-plus-plus.org/)
Vim (https://www.vim.org/)
https://www.javascripttutorial.net/javascript-code-editors/ 1/4
29/07/2022, 07:53 JavaScript Code Editors
GNU Emacs (https://www.gnu.org/software/emacs/)
Note that all these JavaScript editors are free. As a matter of choice, we will use the Visual Studio
Code.
Visual Studio Code
Visual Studio Code is a free and open-source code editor developed by Microsoft. Visual Studio Code
is often called VS Code.
VS Code works across platforms including Windows, Linux, and macOS.
VS Code is highly customizable. It allows you to change the theme, keyboard shortcuts, preferences. It
has lots of useful extensions that add extra functionality to the editor.
https://www.javascripttutorial.net/javascript-code-editors/ 2/4
29/07/2022, 07:53 JavaScript Code Editors
VS Code includes built-in support for JavaScript, which includes IntelliSense, debugging, formatting,
code navigation, refactoring, and many other advanced language features.
To learn all the features supported by VS code, you check it out the JavaScript in Visual Studio Code
(https://code.visualstudio.com/docs/languages/javascript) .
Download Visual Studio Code
To download the Visual Studio Code, you go to the following download link:
Download Visual Studio Code (https://code.visualstudio.com/download)
Installing Visual Studio Code
Setting up the Visual Studio Code is easy and quick. It is a small download so that you can install it in a
few minutes.
A) Windows
To install the VS Code on Windows, you follow these steps:
First, execute the installer from the downloaded file.
Then, open the Visual Studio code.
Note that the installer will add the Visual Studio Code to your %PATH% . It will allow you to type the
command code . to launch the VS Code on that folder.
B) macOS
You follow these steps to install the VS Code on macOS:
First, double-click on the downloaded archive to expands the contents.
Then, drag Visual Studio Code.app to the Applications to make it available in the launchpad.
Installing the Live Server extension
https://www.javascripttutorial.net/javascript-code-editors/ 3/4
29/07/2022, 07:53 JavaScript Code Editors
The live server extension allows you to launch a development local server with the hot reload feature
for static pages. Once you change the JavaScript code, you don’t need to refresh the page to see the
changes.
To install the Live Server extension, you follow these steps:
First, click the Extensions.
Second, search for the Live Server and select the Live Server extension on the list.
Finally, click the Install button.
In this tutorial, you have learned about the JavaScript code editor and how to install the Visual Studio
Code for editing JavaScript source code.
https://www.javascripttutorial.net/javascript-code-editors/ 4/4
