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!
On the menu:
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.
3 thoughts on “Beginning Node.js – REST API with Express 4 – part 2”