Node Js Visual Studio 2019
- Vs Nodejs Extensions
- Install Node Js Visual Studio 2019
- Build And Run Nodejs Application Visual Studio
I am amazed at the adoption of Visual Studio Code by developers from all platforms and languages. According to the 2019 Stack Overflow Developer Survey, VS Code is dominating. The primary reasons I use VS Code are its great support for debugging JavaScript and Node.js code, and how easy it is to customize with free extensions available in Visual Studio Marketplace.
The major difference is that killing the Microsoft Visual Studio 2019 process kills everything, whereas before it was leaving the VBSCCompiler, Node.js and consoles running. When creating a. Right-click the npm node in Solution Explorer and choose Open package.json. IntelliSense in package.json helps you select a particular version of an npm package. When you save the file, Visual Studio adds the package under the Dependencies / npm node in Solution Explorer. First, open Visual Studio and choose File New Project Under the Templates section you should be able to expand a JavaScript section and then choose Node.js. On the right, you will see a big list of project templates, and notice the second one (it’s the second on my list at least) - From Existing Node.js code.
However, there are thousands of extensions available! How do you know which ones are good to use?
One way is to look at an extensions average rating and the number of downloads to gauge its popularity. Another way is to read personal opinion posts like this one. And here you are!
Here are my top picks for Visual Studio Code extensions for Node.js developers.
Bracket Pair Colorizer 2
I try to keep my code as simple as possible and not nest too many things. Unfortunately, sometimes it is unavoidable. Bracket Pair Colorizer 2 colorizes matching brackets, making it easier to visually see which opening and closing brackets, braces, or parentheses belong to each other.
npm
The npm extension provides two features: running npm scripts defined in the package.json
in the editor and validating the packages listed in the package.json
.
Vs Nodejs Extensions
npm Intellisense
The npm Intellisense extension introduces autocomplete behavior when you use require()
to import modules into your code.
ESLint
When I initialize a new Node.js project folder, the first thing I install from the terminal is ESLint.
The ESLint extension uses your local ESLint and configured rules to look for common patterns and issues in JavaScript code, and is designed to help you write better code with fewer bugs. ESLint can also reformat your code to make it more consistent, depending on the rules you have enabled for your project. Be sure to enable Auto Fix On Save ('eslint.autoFixOnSave': true
) in your VS Code settings.
You can initialize an ESLint configuration file in your project with this command.
My current .eslintrc.js
looks like the following.
Code Spell Checker
I don’t know about you, but it really bugs me when I discover I’ve misspelled function names, variables, comments, or anything else in my code. Misspelled code, as long as it’s consistently misspelled, works fine, but mistakes can still be frustrating or embarrassing.
Well, those days are over with Code Spell Checker! One nice thing is the extension understands camelCase
, PascalCase
, snake_case
, and more. Another great feature is there are dictionaries available for Spanish, French, German, Russian, and a number of other languages.
Auto Close Tag
More recent versions of VS Code automatically create closing tags when you are working in an HTML or XML file. For other file types, such as JavaScript, Vue, and JSX, Auto Close Tag will save you some typing!
DotENV
It’s quite common to configure Node.js applications using environment variables. And, one of the most popular modules for managing environment variables is dotenv. The DotENV extension for VS Code adds convenient syntax highlighting when editing a .env
file.
Path Intellisense
The Path Intellisense extension adds autocomplete support for file paths and names, reducing typing as well as the introduction of bugs related to wrong paths.
MarkdownLint
Good code and good documentation go hand-in-hand. I prefer to write README’s and other documentation in markdown format. The Markdownlint extension can help you make sure your markdown syntax is in good form!
Install Node Js Visual Studio 2019
Material Icon Theme
The Material Icon Theme adds a ton of icons to VS Code for different file types. Being able to quickly distinguish different files in project can be a great time saver!
Honorable Mention VS Code Extensions for Node.js
These extensions didn’t make the top 10 list, but are still useful in some scenarios for Node.js developers!
- Encode Decode - Adds commands to quickly convert text to and from various formats, such as Base64, HTML entities, and JSON byte arrays.
- Rest Client - Make HTTP requests directly from your editor and view the responses in a separate window. Great for testing and prototyping APIs.
- Better Comments - This extension helps you create more “human-friendly” comments by adding highlights to different types of comments.
Learn More about Building Secure Node.js Apps in Visual Studio Code
Want to learn more about building secure Node.js applications? Check out these other posts!
Additional links you may find useful!
Here, you will learn how to create a Node.js web application using Visual Studio.
First of all, You must install Node.js development workload for Visual Studio. If you need to install the workload but already have Visual Studio, go to Tools > Get Tools and Features..., which opens the Visual Studio Installer. Choose the Node.js development workload, then choose Modify.
Create a new project by clicking on New Project.. on the start page or FILE menu. This will open a New Project dialog box as shown below.
As shown in the above figure, from the New Project dialog box, expand Installed -> Templates -> JavaScript -> Node.js in the left pane. Select the Blank Node.js Web Application in the centre pane, enter a project name and a location and click OK. This will create a Node.js web application project as shown below.
Build And Run Nodejs Application Visual Studio
As you can see, it has created server.js, which creates a web server listening on the 1337 port and sends the 'Hello World' text as a response to any http request.
Press F5 to run the web project. It will open the command prompt and the browser, as shown below.
So now, you can send different responses based on the requested URLs the same way as shown in the Node.js web server section.