This is the most simple REST API possible. I will explain every single detail in this post.
var express = require('express');
var app = express();
var menu = [{"description" : "papadums", "price":"2,00"}, {"description" : "chicken tikka masala", "price":"14,00"},{"description" : "fisher king beer", "price":"2,50"},{"description" : "sag paneer", "price":"6,00"}];
app.use(express.static(__dirname + '/public'));
app.get('/food', function(req, res){
res.send(menu);
});
app.set('port', process.env.PORT || 3000);
app.listen(app.get('port'));
console.log("the server is running on http://localhost:" + app.get('port'));
Let’s get started
First create a folder named ‘restaurant’ or whatever you would like to name the API.
Then run ‘npm init’ to create a package.json file. This file contains metadata, dependencies etc.:
mkdir restaurant
cd restaurant
npm init
You will get a bunch of questions. Answer them (or accept the defaults) and hit enter:
About to write to /Users/jacqueline/Dropbox/devel/restaurant/package.json:
{
"name": "restaurant",
"version": "0.1.0",
"description": "",
"main": "main.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Jacqueline",
"license": "MIT"
}
Is this ok? (yes)
Install Express
Next we will install Express with NPM. Express is a minimalist web framework for Node.js.
jacqueline@nsa:~/Dropbox/devel/restaurant$ npm install express --save
You will now see ‘express’ mentioned in the package.json.
The ‘–save’ parameter adds a “^” before the package, it will make sure the right version is used.
Create the app
Create a file named ‘main.js’ (that’s how I named the main file in my package.json, you can also name it app.js or server.js).
Add these contents:
var express = require('express');
var app = express();
app.get('/', function(req, res){
res.send('hello world');
});
app.listen(3000);
Next install nodemon because it is awesome. It restarts node every time a file in the project is changed.
Add the ‘-g’ parameter because nodemon should be installed globally and not just as a module in the project folder.
npm install -g nodemon
Now run nodemon main.js on the commandline. It will return:
jacqueline@nsa:~/Dropbox/devel/restaurant$ nodemon main.js
18 Oct 08:04:59 - [nodemon] v1.2.0
18 Oct 08:04:59 - [nodemon] to restart at any time, enter `rs`
18 Oct 08:04:59 - [nodemon] watching: *.*
18 Oct 08:04:59 - [nodemon] starting `node main.js`
Now browse to http://localhost:3000. This will display ‘Hello World’ in the browser.
Serve JSON data
Alter your main.js file and add some json and change the app.get bit:
var express = require('express');
var app = express();
var menu = [{"description" : "papadums", "price":"2,00"}, {"description" : "chicken tikka masala", "price":"14,00"},
{"description" : "fisher king beer", "price":"2,50"},{"description" : "sag paneer", "price":"6,00"}];
app.get('/food', function(req, res){
res.send(menu);
});
app.listen(3000);
Now if we browse to http://localhost/food, we will retrieve our delicious menu. We can also a REST client like POSTMAN to test:
With curl:
curl http://localhost:3000/food
[{"description":"papadums","price":"2,00"},{"description":"chicken tikka masala","price":"14,00"},{"description":"fisher king beer","price":"2,50"},{"description":"sag paneer","price":"6,00"}]
Consuming the API
Create a folder called public in your app directory.
Next add this line to main.js, with this we’ll tell Express to go and find index.html files in a subfolder called public:
app.use(express.static(__dirname + '/public'));
Drop an index.html in the public folder.
This makes the directory structure look like so:
restaurant/
├── main.js
├── node_modules
│ └── express
├── package.json
└── public
└── index.html
Open index.html and add the following code:
Welcome to my restaurant!
And the result is..:
Add Bootstrap with Bower
Bower is like NPM, but for front end scripts. You can use NPM for frontend scripts as well, but I like to keept them separate.
npm install -g bower
Create a file named .bowerrc to tell Bower to put the javascripts into a /public/js:
vim .bowerrc
{
"directory" : "public/js"
}
You can create a bower.json file to organize the dependencies:
bower init
jacqueline@nsa:~/Dropbox/devel/restaurant$ bower init
? name: restaurant
? version: 0.1.0
? description: menu app
? main file: main.js
? what types of modules does this package expose?: node
? keywords:
? authors: jacqueline <jacqueline@nsa.gov>
? license: MIT
Then install your client side javascript dependencies like so:
bower install --save bootstrap
Now we can add some styling:
Last but not least: some feedback when starting the server
In Express you can define variables with app.set. I would suggest to configure the port like this:
app.set('port', process.env.PORT || 3000);
app.listen(app.get('port'));
console.log("the server is running on http://localhost:" + app.get('port'));
process.env.PORT || 3000 means: whatever is in the environment variable PORT, or use 3000 if there’s nothing there.
This makes completed main.js look like this:
var express = require('express');
var app = express();
var menu = [{"description" : "papadums", "price":"2,00"}, {"description" : "chicken tikka masala", "price":"14,00"},
{"description" : "fisher king beer", "price":"2,50"},{"description" : "sag paneer", "price":"6,00"}];
app.get('/food', function(req, res){
res.send(menu);
});
app.use(express.static(__dirname + '/public'));
app.set('port', process.env.PORT || 3000);
app.listen(app.get('port'));
console.log("the server is running on http://localhost:" + app.get('port'));
And this is where this tutorial ends. I love open source. It’s great to be able to use all these tools (Node, NPM, Express) and be very productive. Next time I will show how to use a (NoSQL) database. Not sure to use MongoDb or Postgresql yet. We’ll see.
