Node.js & express.js for noob, premiers pas

Bien le bonjoir, je vous propose que nous découvrions nodejs ensemble. Pour ce faire, je vais reprendre le principe de Pibou en utilisant nodejs pour exposer une api que je pourrais attaquer avec différentes technologies front et/ou mobile. Mais pour commencer, parlons un peu de Node.js node_home_install

C’est quoi ?

Node.js is a platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

Pour résumer, Node.js est un wrapper autour du moteur de javascript V8 qui permet de coder du bas niveau du côté serveur en Javascript.

Événementiel et non bloquant

La programmation est orientée événementielle: chaque action possède une fonction de rappel. Contrairement à d’autres technologies, la boucle de gestion des événements est transparente pour l’utilisateur, c’est le côté non bloquant. Concrètement, si vous lancez l’exécution de plusieurs actions, elles seront traitées en parallèle, sans attendre que la précédente ait appelé sa fonction de rappel.

Écosystème

Nodejs c’est aussi tout un ensemble d’outils. La philosophie peut se résumer à « vous avez un besoin, il y a un module pour ça ». C’est bien beau me direz-vous, mais comment gérer cette foison de modules? C’est là qu’intervient NPM, le node package manager. Il est très utile pour gérer vos modules. Il existe une multitude de modules, nous en reparlerons au fur et à mesure.

Installation

Pour commencer, il faut installer node.js sur votre machine, il y a tout ce qu’il faut sur http://nodejs.org/ Nous pourrions tout coder directement, mais je préfère utiliser un module qui nous facilitera la tâche : express.js. Pour installer express globalement, nous allons nous servir de npm (installé avec node)  :

npm install express -g

Voilà, il ne reste plus qu’a utiliser la génération d’express pour avoir un aperçu de notre structure de projet.

express pibou-node

Regardons ce que ça donne :

sortie console de la commande express pibou-node

sortie console de la commande express pibou-node

Suivons les instructions, d’abord aller à la racine du projet

cd pibou-node

Puis installer les dépendances :

npm install

Puis, lancer l’application :

node app

La console nous informe que le server est lancé : server_started Il n’y a plus qu’a ouvrir un navigateur : express_default Et côté serveur : first_responses   Voilà, on a un serveur qui tourne et qui rend une page. Bon, c’est un peu « magique » pour le moment, allons jeter un œil sur le code généré.

La structure du projet

La configuration

Le fichier package.json représente la configuration du projet. Nous allons juste donner un nom et une version à notre projet, ce qui nous donne :

{
  "name": "pibou-node",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.4.x",
    "jade": "*"
  }
}

Je vous conseille de faire un tour sur http://package.json.nodejitsu.com/, c’est une très bonne documentation dynamique pour la configuration. Pour savoir quelles sont les dépendances et leur version, vérifier les packages sur https://www.npmjs.org/.

L’application

On peut voir dans la configuration que le lancement de l’application se fait par la commande « node app.js », on peut en déduire que la racine du projet est dans le fichier app.js. Décortiquons son contenu :

/**
 * Module dependencies.
 */

var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.json());
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
  app.use(express.errorHandler());
}

app.get('/', routes.index);
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

La première partie liste les dépendances vers des modules de la bibliothèque ou vers les méthodes exposées dans l’application. On retrouve les modules importés via le package.json dans le dossier pibou-node/node_modules. Vient ensuite la configuration du serveur et les éléments à utiliser.  On voit qu’on utilise le moteur de templating jade pour les vues qui sont référencées dans le répertoire pibou-node/views. Vous pouvez choisir le moteur qui vous fait plaisir, il se trouve que Express.js propose jade par défaut. Cela vous permet de générer votre réponse au format html (ou autre format à la sauce xml). Express fourni un ensemble d’outil (log, middleware, traitement du json) qui sont bien pratiques. Je vous encourage vivement à faire un tour sur la documentation d’api et le guide d’express.js

Le Routing

Le mécanisme de routing est proche de ce que vous pouvez trouver avec rails. Vous déclarez un path et vous pouvez y lier une méthode. Prenons un cas concret :

var user = require('./routes/user');
//...
app.get('/users', user.list);

Vous dites que vous allez appeler la méthode ‘list’ exportée de pibou-node/routes/user.js. Si on regarde le fichier user.js ;

/*
 * GET users listing.
 */

exports.list = function(req, res){
  res.send("respond with a resource");
};

Le « exports. » est utilisé pour exporter la méthode, la rendre visible par require. La fonction se contente de répondre avec le texte « respond with a resource » sur une requête en get sur l’url http://localhost:3000/users.

Le templating

Nous avons parlé de jade, nous pouvons voir son utilisation dans le fichier routes/index.js.

/*
 * GET home page.
 */

exports.index = function(req, res){
  res.render('index', { title: 'Express' });
};

C’est la partie render qui va appeler la vue correspondante, ici ça sera pibou-node/views/index.jade et lui passer un objet { title: ‘Express’ }. C’est la configuration dans pibou-node/app.js qui a défini pibou-node/views comme répertoire de référence pour les templates. L’appel à render précise de récupérer le fichier pibou-node/views/index dont l’extension est déterminée par le moteur de templating choisi, « .jade » dans notre cas. Allons regarder ce fichier de template :

extends layout

block content
  h1= title
  p Welcome to #{title}

Le vous laisse lire la documentation pour la syntaxe. Le fichier défini une structure html et utilise une variable pour rendre le titre. Nous avons vu qu’il suffit de passer un objet avec les propriétés attendues pour qu’il soit utilisable dans le template. En ce qui concerne le layout, si on suit la logique précédente, il suffit d’ouvrir le fichier /views/layout.jade :

doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

Il s’agit tout simplement de la structure de base d’une page html qui référence une CSS de base.

Et la suite ?

Je vous laisse découvrir ces technologies, générer votre projet et explorer la configuration du package.json. Notre prochaine étape nous fera manipuler le code et découvrir de nouveaux modules. @Bientôt

Références

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *