Freigeben über

Installing Express and How to use Node.js Packages with Visual Studio

  • Artikel

When it comes to IDEs, Visual Studio makes programming in Node.js really easy. In my previous post we installed the Node.js tools and ran some basic “hello world” projects. In this post let us take a deeper dive into what is possible. In this post I simply want to install a node package using the Visual Studio tooling. With just a right mouse click you can bring in some of the packages through the IDE. Let’s do this with the most ubiquitous packages of all of them - Express.

What I’d like to cover in this and the next few posts

  • Adding packages to a Node.js project

  • Using some of the Project Templates in Visual Studio

  • Using some of the powerful debugging tooling in Visual Studio

Node Packages

One of the first places any Node.js developer ends up is here, the https://npmjs.org/ website. It is where you can download Node packages, which extend and expand the power of Node itself, by effectively adding additional libraries for specific capabilities you wish to add to your project (Node application).

Node packages are an elemental part of being a developer. The philosophy is to bring in only those libraries that you need, keeping things light and clean.

A perfectly valid approach is to use commandline utilities to do this. I am personally always at a command prompt so I have no problem with the command line. I actually use vsvim for my default editor for everything so I’m quite comfortable with the UNIX/Linux approach to programming.

However, nothing wrong with a right mouse click.

image001

Figure 1 - Node Package Manager Web Site

One of the interesting aspects of this site is that it tells you the most popular and most used packages.

image002

Figure 2 - Ranked Node Packages

This means that when I discuss certain modules, I’ll probably walk through how some of these modules might work. In fact, Visual Studio has built-in support for express, which seems like a great place to start.

Node’s express package

The goal of Express is to provide small, robust tooling for HTTP servers. It is built on the package Connect. It helps implement the popular pattern of MVC into your app and lets you leverage existing templating libraries, such as ejs, jade, and dustjs. These templating libraries help you manage the web based user experience sent to the browser.

Express helps with routes, handling requests and views. It simplifies such things as parsing payloads, cookies, and storing sessions.

If you want to write a simple REST-based application, express can dramatically reduce the amount of code you have to write.

Developers often leverage MongoDB, which is a JSON-based database and Mongoose, which acts as an abstraction layer to MongoDB.

image003

Figure 3 - How some of the Node packages work together

Select New Project from Visual Studio.

image004

Figure 4 - File/New Project

Choose Blank Node.js Web Application.

image005

Figure 5 - Blank Node.js Web App

Open up Visual Studio Solution Explorer.

image006

Figure 6 - Adding New Modules

I did run into a little bit about bump with the secure socket layer certificates. There was some problem about downloading the packages so I issued this command to reset the certificate authority. Seemed to solve the problem.

The error I was getting was “Error: SSL Error: CERT_UNTRUSTED.”

At the command prompt I issued the following:

Command line
1 npm config set ca null

image007

Figure 7 - Adding express

At the end of this process, you should see:

image008

Figure 8 - After express is added

There are some new entries in package.json. This now includes express as a dependency.

image009

Figure 9 - package.json shows installed packages for a project

And Visual Studio Solution Explorer contains a few more things:

image010

Figure 10 - Visual Studio showing express installed

Notice that expresses itself has a few dependencies on other packages listed above. You can think of express is a collection of other useful packages.

buffer-crc A pure javascript CRC32 algorithm that plays nice with binary data
commander the complete solution for node.js command-line programs
connect High performance middleware framework
cookie Cookie parsing and serialization
cookie-signature Sign and unsign cookies
debug A debugging utility
fresh HTTP response freshness testing
merge-descriptors Merge objects using descriptors
methods HTTP methods that node supports, like http verbs, like post, put, head.
mkdirp Recursively mkdir, like `mkdir -p`
range-parser Range header field string parser
send Better streaming static file server with Range and conditional-GET support

If you’re really curious you can dive into all the code brought into your project, as seen below:

image011

Figure 11 - The project folders shows the packages as well

It is all Javascript code in these folders from figure 11.

server.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 ////////////////////////////// // This code is the non-express version //    // var http = require('http'); // var port = process.env.port || 1337; // http.createServer(function (req, res) { // res.writeHead(200, { 'Content-Type': 'text/plain' }); // res.end('Hello World\n'); // }).listen(port); ////////////////////////////// // This is Hello World with express // Module dependencies. var express = require('express'); var app = express(); // Configuration app.configure( function() { }); // Routes app.get('/', function(req, res) {     res.send('Hello World'); }); app.listen(1337);

You can see that the code with express abstracts away some details. The notion of writing a header and including the HTTP module is hidden away in the express plumbing.

All I did at this stage is hit the F5 key to get it up and running. In the next post will show you some of the more power of Visual Studio and debugging this application.

image012

Figure 12 - Hello World with express

Summary

The purpose of this post was to show you how you can add a node package using Visual Studio. Some extra details about what happens in the packages installed was also provided. Brief introduction to the express package was outlined along with the corresponding dependent modules that it uses. Finally, if you had some issues with SSL, keep in mind the command I provided.

Comments