DEV Community

Cover image for How to Create a Node.js Project in VS Code
Mateen Kiani
Mateen Kiani

Posted on • Edited on • Originally published at milddev.com

How to Create a Node.js Project in VS Code

Creating a Node.js project in VS Code is straightforward. You can scaffold your application, set up scripts, and debug right from your editor. This guide walks you through installing the necessary tools, initializing your project, and configuring VS Code for a smooth development workflow.

By the end, you’ll have a working Node.js app, custom scripts in your package.json, and a launch profile for debugging—all within VS Code.

Prerequisites

Before you begin, make sure you have:

  • Node.js installed on your machine
  • Visual Studio Code (VS Code) installed
  • Basic familiarity with the command line

Tip: If you need to update Node.js, see how to update Node.js on Windows.

Install Node.js and VS Code

  1. Visit the official Node.js website and download the LTS version.
  2. Run the installer and follow the prompts.
  3. Install VS Code from the official site.

After installation, open a terminal and verify:

node --version
npm --version
Enter fullscreen mode Exit fullscreen mode

You should see version numbers for both commands.

Initialize the Project

  1. Open VS Code.
  2. Open a new terminal.
  3. Navigate to your workspace folder:
   cd path/to/your/projects
Enter fullscreen mode Exit fullscreen mode
  1. Create a new folder and enter it:
   mkdir my-node-app && cd my-node-app
Enter fullscreen mode Exit fullscreen mode
  1. Initialize your project:
   npm init -y
Enter fullscreen mode Exit fullscreen mode

A package.json file will appear with defaults. You can edit fields like name, version, and description later.

Configure VS Code

To boost productivity, add these files to your project root:

  1. .vscode/launch.json – for debugging.
  2. .vscode/tasks.json – for running build or test tasks.

Sample launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug App",
      "program": "${workspaceFolder}/index.js"
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

You can start debugging with F5 once this file is in place.

Add Your First Script

Open package.json and add a start script:

  "scripts": {
    "start": "node index.js",
    "dev": "nodemon index.js"
  }
Enter fullscreen mode Exit fullscreen mode
  • npm start will run your app.
  • npm run dev (with nodemon installed) reloads on file changes.

Write a Simple App

Create index.js in your project root:

const http = require('http');
const PORT = process.env.PORT || 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello, Node.js in VS Code!');
});

server.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});
Enter fullscreen mode Exit fullscreen mode

Install Dependencies

If you need extra packages, use npm or Yarn:

npm install express dotenv
# or
npm install -g yarn && yarn init
Enter fullscreen mode Exit fullscreen mode

Tip: You can also manage packages with Yarn; see how to install Yarn using npm.

Run and Test Your App

  1. Start the server:
   npm start
Enter fullscreen mode Exit fullscreen mode
  1. Open your browser at http://localhost:3000.
  2. You should see Hello, Node.js in VS Code!

Use the Debug panel in VS Code to step through code, inspect variables, and set breakpoints.

Next Steps and Best Practices

  • Add a .gitignore file to exclude node_modules/.
  • Use ESLint and Prettier for consistent code style.
  • Write unit tests with Jest or Mocha.
  • Containerize your app with Docker for consistent environments.

“The best way to learn is by doing—build small features, tweak configs, and explore VS Code extensions.”

Conclusion

You’ve set up a basic Node.js project in VS Code, initialized your package.json, added scripts, and configured debugging. From here, you can add frameworks like Express or NestJS, integrate testing, and automate tasks with GitHub Actions.

Getting your environment right from the start saves time down the road. Now that you know the essentials, experiment with extensions, linters, and deployment options to refine your workflow. Happy coding!

Top comments (2)

Collapse
 
0hep_ profile image
0hep_

Good post,

You may want to review your markdown in this post. Code blocks are broken for me in this post.

Collapse
 
kiani0x01 profile image
Mateen Kiani

Thanks for pointing this out there was a backtick that was causing markdown to break.
I've fixed it.