Install a Code Editor for JavaScript
Introduction
In the previous chapter, you ran JavaScript from the terminal. That workflow is essential, but plain terminals lack rich syntax highlighting, autocomplete, and debugging integration. This chapter installs a modern editor so you can write JavaScript with better feedback and fewer typos.
Prerequisites
- Node.js LTS installed (
node --version,npm --version) - Completed terminal Hello World
- Internet access to download an editor
- At least 4 GB RAM (8 GB recommended)
Why Use a Code Editor for JavaScript
A capable editor speeds up learning and surfaces mistakes early.
Key benefits:
- Syntax highlighting for keywords, strings, and template literals
- IntelliSense for built-ins and project dependencies
- Integrated terminal to run
nodeandnpmin one window - Debugger support for breakpoints (used in later chapters)
- Extensions for ESLint, Prettier, and framework tooling
Editor Options Used Most in Practice
For JavaScript beginners, these two dominate:
| Editor | Best for |
|---|---|
| VS Code (recommended) | Web and Node.js work, huge extension ecosystem, free |
| WebStorm | JavaScript-first IDE with strong refactoring (paid, free trial) |
Tip
Choosing Quickly
If you are unsure, install VS Code. It matches most tutorials, teams, and open-source docs in the JavaScript world.
Option A: Install Visual Studio Code (Recommended)
Step 1: Download VS Code
- Open https://code.visualstudio.com/
- Download the installer for your OS (Windows
.exe, macOS.dmg, Linux.deb/.rpm/ Snap) - Run the installer with default options unless your IT policy says otherwise
Step 2: First Launch
- Open VS Code
- Pick a theme and keyboard layout in the welcome flow (defaults are fine)
- Open the integrated terminal: Terminal → New Terminal (or
Ctrl+`/Cmd+`)
Verify Node from the VS Code terminal:
# Confirm Node.js is visible inside VS Code
node --versionStep 3: Helpful Extensions (Optional Now, Useful Soon)
Open the Extensions view (Ctrl+Shift+X / Cmd+Shift+X) and consider:
| Extension | Purpose |
|---|---|
| ESLint | Linting and style feedback |
| Prettier | Consistent formatting |
| JavaScript (ES6) code snippets | Faster boilerplate (often bundled) |
You do not need every extension on day one. Add ESLint after coding standards.
Warning
Install extensions from trusted publishers (Microsoft, ESLint org, Prettier org). Random “JavaScript helper” extensions can be low quality or noisy.
Option B: Install WebStorm (Alternative)
- Download from https://www.jetbrains.com/webstorm/
- Install with the wizard (Node.js detection usually works if
nodeis on PATH) - Open a folder as a project and use the built-in terminal to run scripts
WebStorm is excellent but paid for long-term commercial use. VS Code is enough for this entire tutorial track.
Connect the Editor to Your Node.js Install
VS Code and WebStorm both rely on the same Node.js binary you configured in install chapters.
Checklist:
node --versionworks in the editor’s integrated terminal- You open a folder (project root), not only a single loose file, when starting real projects
- Line endings and encoding stay UTF-8 (VS Code default)
FAQ
Do I need VS Code to write JavaScript?
No. Any text editor works at minimum. VS Code is recommended because integration with terminals, debuggers, and extensions is smooth for beginners and professionals.
Is Visual Studio the same as VS Code?
No. Visual Studio is a large Microsoft IDE often used for .NET. Visual Studio Code (VS Code) is a lightweight, cross-platform editor widely used for JavaScript.
Should I install Node.js inside VS Code?
No. Install Node.js on your system (or via nvm), then let VS Code’s terminal call that node binary.
Can I use IntelliJ IDEA for JavaScript?
Yes—IDEA Ultimate includes JavaScript support. This course still demonstrates VS Code because it is the most common default in web teams.
Why does autocomplete not work in a new file?
Save the file with a .js extension, open a folder workspace, and ensure Node/npm are installed. For bigger projects, a package.json helps tooling understand dependencies.