Web Development

ExpressJS is the arguably most popular web framework from the NodeJS community. However it is not a full-stack framework when compared to popular frameworks from other communities like Rails, Django and CakePHP. It is more in tune with Sinatra‎, Padrino and the Silex framework.

Here’s a written attempt to explain a simple implementation for those wanting to learn ExpressJS.

A Sample ExpressJS Application

var http = require('http');
var express = require('express');
var app = express();

app.set('view engine', 'jade');
app.set('views', './views');

app.get('/', function(req, res) {
  res.render('index', {title: 'Welcome', message: 'Hello ExpressJS!'});
});

app.listen(3000);
console.log('Running Express...');

Our above implementation assumes that we have a folder named views and a file named app.js. This code implementation will be inserted in app.js

To run the code, one simply need to work write on the command line:

node app

Node Installation

If you have Node and Express installed on your machine you can skip this.

Node installation is quite straightforward. Just go to the Node download page and pick an installer that matches your development machine.

After installation, you will need ExpressJS installed too. ExpressJS is a module installed via the Node Package Manager(npm) which is something that is installed with NodeJS by default.

sudo npm install express -g

You will have the latest ExpressJS installed globally on your machine.

Creating an Instance

var http = require('http');
var express = require('express');
var app = express();

app.listen(3000);
console.log('Running Express...');

In the above code, you will require the express module so that we can use express for a variety of things. The last portion of the code will run the server and listen to port 3000.

$ node app
Running Express...

You can run the program with a simple node app in the root of your application. Now, going to the browser and browsing, http://localhost:3000/ would present you with a:

Cannot GET /

This is of course we don’t have anything to accept any request from /.

Creating Routes

We will have to insert routes before the creation of the server.

app.get('/', function(req, res) {
  res.send('<h1>Welcome to ExpressJS!</h1>');
});

If you haven’t stopped the server, you can stop and start it for our changes to take place. This will render Welcome to ExpressJS! on our browser.

$ curl http://localhost:3000
<h1>Welcome to ExpressJS!</h1>

Creating Views

Now let’s send a more serious response. We will use a view engine for our views.

app.set('view engine', 'jade');
app.set('views', './views');

We will be using jade as our view engine which is the easiest to implement with express. The next line tells our app that we have views in the views folder.

Now lets’ create our view:

html
  head
    title Welcome
  body
    #container
      Hello ExpressJS!

Save the above code in a file named index.jade in the views folder.

As you can see our template looks a bit like slim, a really great templating engine used as an option in Rails development.

Replace our route with the following:

app.get('/', function(req, res) {
  res.render('index');
});

Our app would now render our view file, index.jade

Sending values to our View

Now to make our content more dynamic, we will be sending values to our view file.

app.get('/', function(req, res) {
  res.render('index', {'title': 'Welcome', 'message': 'Hello ExpressJS!'});
});

The extra parameter of the render method makes the index value available as a variable in our view file. Now, let us change our view file.

html
  head
    title #{title}
  body
    #container
      p #{message}

This will in effect render something like this:

<html>
  <head>
    <title>Welcome</title>
  </head>
  <body>
    <div id="container">
      <p>Hello ExpressJS!</p>
    </div>
  </body>
</html>

Conclusion

Developing with ExpressJS, just like any relative new technology is quite fun and I am getting the hang of really cool web framework.

Expect more posts about writing ExpressJS code in the future. Particularly, I’m interested in discussing database-centric applications with it.