Node Js + Express Js + Jade + Socket I/O + Sails Js

Node.js is a server-side software system designed for writing scalable Internet applications, notably web servers. Programs are written on the server side in JavaScript, using event-driven, asynchronous I/O to minimize overhead and maximize scalability (source : wikipédia)

Node.js est un système logiciel côté serveur conçu pour écrire des applications Internet évolutives, les serveurs Web, notamment. Les programmes sont écrits sur le côté serveur en JavaScript, en utilisant la programmation évènementielle, E / S asynchrone pour minimiser les temps d’attentes et optimiser l’évolutivité.

Node JS est tout simplement un interpréteur de JavaScript côté serveur. Ensuite viennent toutes les spécifications propres à Node (utilisation d’un thread, il est open source, développé par Ryan Dahl, …) (source : http://www.atinux.fr/category/node-js/)

Plus besoin d’apache ou nginx, le serveur web est écrit en Javascript/NodeJs.

NPM : Node Package Manager (installation de package : semblable au gem)

Installation de Nodejs et npm avec hombrew (gestionnaire de package pour mac osx) : « brew install node »

Pour être sûr que nodejs retrouve les modules, ajouter dans votre .bashrc ou .zshrc (oh my ZSH) :

export NODE_PATH="/usr/local/lib/node"
et
export PATH="/usr/local/bin:/usr/local/sbin:/usr/local/mysql/bin:/usr/local/share/npm/bin:$PATH"

Puis évidemment un source de votre fichier .bashrc pour être sûr que cela soit pris en compte.

Test de node js, faire un fichier server.js dont le contenu est :

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen(8124, "127.0.0.1");
console.log('Server running at http://127.0.0.1:8124/');

Lancer le fichier avec node server.js et aller à http://127.0.0.1:8124/ et vous devez voir Hello World

Express.js est un framework (MVC) écrit en JavaScript/node.js, et qui s’inspire du célèbre Sinatra(Ruby). Comme ce dernier, il permet le développement de services RESTful. C’est un des premiers packages pour node.js, et aussi un des mieux documentés. (source : http://www.atinux.fr/2011/08/31/introduction-a-express-js-partie-1-la-base/)

Express 3.x is a light-weight web application framework to help organize your web app into MVC architecture on the server side. You can use a variety of choices for your templating language (like ejs, jade, dustjs) (source : http://stackoverflow.com/questions/12616153/what-is-express-js)

Express 3.x est un cadre léger d’applications pour aider à organiser votre application Web dans l’architecture MVC sur le côté serveur. Vous pouvez utiliser une variété langage de templates (comme ejs, jade, dustjs)

Installer ExpressJs avec npm :

npm install express

Vous venez d’installer votre premier package avec npm, cela vous a créé un dossier node_modules avec dedans un dossier express.

Vous pouvez aussi installer express en global pour générer des applications avec les dépendances souhaitées (ex : session, params, …, pour faire son propre serveur web) :

npm install -g express

Puis génération d’un projet :

express mon_appli_express

Puis :

cd express_example && npm install

afin d’installer les dépendances nécessaires.

Nous pouvons maintenant lancer l’application en tapant : node app.js

Rendez-vous sur localhost:3000 pour voir le résultat.

Le résultat est écrit avec Jade :

jade the haml inspired Node tempting engine (source : http://shapeshed.com/setting-up-nodejs-and-npm-on-mac-osx/)

Jade un moteur de templates inspiré de haml pour Node.

Voici un le fichier views/layout.jade :

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

Block content correspond au yield de Rails (là où sera recopié le code généré par la vue)

Voici un le fichier views/index.jade :

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

On hérite ici du layout précédent et on retrouve block content qui sera remplacé dans le layout. « title » est affiché dans le h1 et uniquement le contenu de title qui est passé par expressjs dans le fichier routes/index.js :

/*
* GET home page.
*/

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

Je vous laisse découvrir la suite sur jade car là je n’ai pas creuser plus pour l’instant.

Socket I/O :

Socket.IO is a JavaScript library for realtime web applications. It has two parts: a client-side library that runs in the browser, and a server-side library for node.js. Both components have a nearly identical API. (source : wikipedia)

Socket.IO est une bibliothèque JavaScript pour les applications web en temps réel. Il comporte deux parties : une bibliothèque côté client qui s’exécute dans le navigateur, et une bibliothèque côté serveur pour node.js. Les deux composants ont une API presque identique.

C’est cette librairie qui va nous permette d’envoyer des évènements du serveur vers les navigateurs connectés à l’application et vice versa, c’est donc ça qui est le plus nouveau pour nous, la capacité, lorsqu’un évènement arrive sur le serveur, de « répandre » cet évènement vers les navigateurs connectés à l’application, bien évidemment cela sans rechargement de page (et oui on est en JS). La plupart des applications de chat en nodejs que vous pouvez trouvez dans les tutoriels utilisent cette librairie (cf : code projet git https://github.com/naholyr/node-chat-socketio-handshake).

Support des navigateurs pour Socket I/O :

Desktop
Internet Explorer 5.5+
Safari 3+
Google Chrome 4+
Firefox 3+
Opera 10.61+
Mobile
iPhone Safari
iPad Safari
Android WebKit
WebOs WebKit

(source : socket.io)

Sailsjs est un framework MVC basé sur express js et socket IO, avec une architecture proche de rails et permettant la création rapide de webservice retournant du json notamment.

A voir : 
http://www.atinux.fr/category/node-js/
http://naholyr.fr/2011/07/authentification-et-websocket-avec-node-js-express-et-socket-io/

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.