Codectionary / Developer documentation / JavaScript

Create, run and debug a JavaScript project in VS Code, with or without Node.js.

What VS Code does

Visual Studio Code is a code editor available for Windows, macOS and Linux. It has built-in JavaScript language features and debugging support. It does not install Node.js for you. For a script that runs in a browser, you can start with an HTML file and browser developer tools; for a .js script run from the terminal, install Node.js separately.

Download VS Code from the official site and follow the instructions for your operating system. Open a project folder rather than editing an isolated file: the Explorer, terminal and debugger will then use that folder as context.

Create and run a project

Use File > Open Folder to open or create javascript-start. In the Explorer, create app.js, type the example below and save it. Open Terminal > New Terminal; the terminal should start in the open folder. After installing Node, run node --version and then node app.js.

The message appears in the terminal. If you instead write document.querySelector, create an HTML page that loads your script and run it in a browser; a bare Node process has no DOM. A saved HTML file can use browser JavaScript without Node, although some browser APIs require a local web server.

VS Code integrated terminal

node --version
node app.js

Debug instead of guessing

Click the gutter beside a line in app.js to set a breakpoint. Open Run and Debug, choose the Node.js environment when prompted and start debugging. Execution pauses at the breakpoint so you can inspect variables, step to the next line and resume.

For code running in a browser, use browser developer tools or VS Code’s documented browser debugging workflow. Do not expect the Node debugger to provide document or window. VS Code already includes JavaScript language support and Node debugging; an extension is not necessary for this beginner setup.

Common setup problems

If node is not recognised, install a supported LTS release and reopen VS Code so its integrated terminal receives the new PATH. If the debugger opens a configuration for the wrong file, check the active file and the launch configuration’s program path.

If you see old output, save app.js before running it again. If a script cannot be found, check that the integrated terminal is in the correct folder and that the file extension is .js, not .js.txt.

Syntax

node app.js

Examples

A first JavaScript file

Save this as hello.js, then run node hello.js in a terminal. Expected output: Hello, Codectionary!

console.log("Hello, Codectionary!");
  1. The quotes create a string containing the message. console.log writes that string to the terminal when Node.js runs this file.
  2. Save the file as hello.js, open a terminal in its folder and run node hello.js. The output is the message without quote marks.
  3. Try changing the message and running the file again. If the old message appears, check that you saved the file and are running the file you edited.

Best practices

  • Open a folder for each project.
  • Save the file before running or debugging it.
  • Use built-in JavaScript tooling before adding extensions.
  • Choose a Node or browser debugger that matches where the code actually runs.

Runtime & versions

Browsers and JavaScript runtimes. Feature availability depends on the language and runtime version used by your project; consult the official reference below.

ECMAScript specification

Specifications & further reading