Quite easy, just head over to NodeJs.Org and download and install it. The next step is to install Express. Fire up Git-bash or a command prompt and use the Node package manager (npm) to install Express globally:

npm install -g express

Now, lets use Express to setup a standard layout for us to start with:

express gomalta --ejs --css less

This is basically telling Express to create a new NodeJs app, configured as a webb application using Express. I specifically provided a name "gomalta" which will make it create the folder. I also selected a specific view engine (default is JADE) and finally I specified I want to use LESS for my CSS authoring (default is plain old CSS).

Almost there. Open up "package.json" and provide an application name. Also note that the defined packages under "dependencies" (and their sub dependencies) still hasn’t been installed. Lets fix it. Ensure you are in the same directory as your "package.json" file and type:

npm install

Watch the colors in the console fly by and rest ensured that you soon will be ready to get your hands dirty. When the install is done, you actually have a webb app waiting to get started. Lets start it:

node app

Fire up your browser of choice (read Chrome) and navigate to: http:\localhost:3000

You should be presented with a page saying something like:

Welcome to Express

WebMatrix, IISNode & Visual Studio

You could actually have achieved this using Microsofts WebMatrix, which gives you a NodeJs Express template, which will bring everything down and set you up with Node for IISExpress so that you can host NodeJs apps in IIS. This generated site could then of course be opened and managed in Visual Studio 2012. There’s a nice video about it here: http://blog.stevensanderson.com/2012/07/09/node-js-development-with-webmatrix-2-and-express/

WebStorm

Now lets challenge our selves as Microsoft sheeps and take a step out of our comfort zone. Lets use another IDE, WebStorm, by awesome JetBrains.

After installing WebStorm just open it and use it to creata a new WebStorm project by pointing it to the directory where we created our app.

Making intellisense happy – treat EJS as HTML

The view located in the "views" directory has a file extension of "ejs" which will not be picked up by WebStorm as HTML. Either you map it under "File --> Settings" or you tell Express to use another file extension. Lets check how to do the later. You can get some information about this in the documentation for Express, right here. Basically, I ended up with this:

app.js

app.set('view engine', 'ejs');
-->
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

Now, just rename your view-files from "x.ejs" to "x.html"

Enable debugging

You can get some official guidance of it here: http://www.jetbrains.com/webstorm/webhelp/running-and-debugging-node-js.html

Guessing I’m “one of thoose” since I went with the manual approach. I downloaded the compressed source code manually (using the link from http://nodejs.org) and extracted it somewhere I was happy with. After that I just pointed out the root-directory of it (the one containing the "src" folder. That’s it. Now I could debug my files. Sweet! That’s it for now.

//Daniel

Category:
Development
Tags:
, , , ,

Join the conversation! 3 Comments

  1. [...] Getting started with NodeJs and Express on Windows – Daniel Wertheim gives a quick start guide to getting up and running with NodeJS on Windows, looking at the creation of application using the package manager NPM and Express, and discussing the IDE support for similar procedures. [...]

  2. Good one… Tanks!

Comments are closed.

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: