Blog ACENSI
Express JS

Créer sa première application avec Express.js

NodeJs est un environnement d’exécution JavaScript open source et cross platform.
Node bénéficie de larges références comme par exemple : http://www.tothenew.com/blog/how-are-10-global-companies-using-node-js-in-production/
NPM, abréviation de Node Package Manager, est le gestionnaire de packaging pour Node. Pour ceux qui ont une expérience avec d’autres langages, c’est l’équivalent de Maven pour java, Composer pour PHP, NuGet pour .Net …
ExpressJs est un framework Node bénéficiant d’une forte notoriété, très complet et s’intégrant avec un large écosystème technique : bases de données, APIs…
Exemples de sociétés qui utilisent le framework express : https://expressjs.com/en/resources/companies-using-express.html

Installation

Les documentations officielles sont riches et proposent des exemples concrets.
Commençons tout d’abord par installer NodeJs :
Pour les utilisateurs de MacOs et Windows, l’installation est assez simple via un installeur téléchargeable à l’adresse suivante : https://nodejs.org/fr/download/
Pour les versions Ubuntu et Debian de linux, il faut exécuter :

curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs

Pour les autres versions, une documentation complète est disponible ici : https://nodejs.org/en/download/package-manager/
Nous pouvons valider l’installation avec ces deux commandes :
Vérifier la version de NodeJs

node -v
v8.9.1

Vérifier la version de NPM

npm -v
5.6.0

 

Créer sa première application NodeJs

Une fois les installations de Node et NPM terminées, nous pouvons créer notre première application.
Pour cela, on doit créer un fichier que je vais nommer “acensi.js” dont voici le contenu :

var http = require("http");
http.createServer(function (request, response) {
   response.writeHead(200, {'Content-Type': 'text/plain'});
   response.end('Hello Acensi Lyon !');
}).listen(8000);
console.log('Le serveur est en marche sur le port : 8000');

Nous pouvons désormais naviguer dans la racine du fichier et lancer la commande suivante :

node acensi.js
Le serveur est en marche sur le port : 8000

Si on accède à l’adresse : http://localhost:8000, nous aurons le message suivant : Hello Acensi Lyon !
Cela signifie que notre application Node fonctionne comme prévue et nous pouvons maintenant passer à l’utilisation du framework Express.
 

Créer sa première application ExpressJs

Dans cette partie, nous allons recréer la même application “Hello Acensi” à l’aide du framework Express.
Nous commençons par créer le répertoire qui va contenir notre application :

mkdir helloExpress
cd helloExpress\

Nous pouvons désormais lancer la commande npm init qui, comme son nom l’indique, sert à initialiser le projet avec NPM via une liste de questions qui servent à définir le projet. Après avoir terminé l’initialisation, on obtient un fichier nommé “package.json” ou son contenu ressemble à ceci :

{
  "name": "helloexpress",
  "version": "1.0.0",
  "description": "Application Hello world faite avec ExpressJs.",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "Acensi",
    "Lyon",
    "NodeJs",
    "ExpressJs"
  ],
  "author": "Wael FEZAI",
  "license": "ISC"
}

Maintenant, on peut installer Express via la commande suivante : npm install express.
On remarque que les lignes suivantes s’ajoutent à notre fichier package.json :

"dependencies": {
    "express": "^4.16.2"
  }

Express est alors considéré comme dépendance du projet. Pour utiliser une dépendance, on recourt à la fonction “require()” dans notre code, ainsi voici notre nouveau code :

var express = require('express')
var app = express()
app.get('/', function (req, res) {
  res.send('Hello Acensi Lyon! ExpressJs')
})
app.listen(8000, function () {
  console.log('L’application express est lancé sur le port 8000')
})

Si on lance notre application avec la même commande “node acensi.js”, on remarque que l’on a le même comportement qu’avec la première application avec un code plus simple.
 

Première utilisation d’Express Generator

Après avoir mis en œuvre Nodejs et Expressjs, nous allons introduire Express generator qui va nous servir à définir le skeleton de notre application Express.
Nous allons ensuite créer et lancer un nouveau projet via les commandes :

express helloworldEG
cd helloworldEG/
npm install
npm start

On naviguant à l’adresse http://localhost:3000/, on aura un message d’accueil pour notre application express générée automatiquement.
Le code généré est simple :
● “app.js” qui contient les différentes logiques pour lancer notre application et qui est lancé via la commande npm start avec l’intermédiaire du fichier “bin/www” qui est le point d’entrée pour l’application,
● Un dossier “public” qui contient l’ensemble de fichier statiques (js, css ….),
● Le dossier “route” ou on insert les différents fichiers js qui configurent le routage de notre application,
● Les vues de notre application sont définis avec jade (pugjs) dans le dossier “views”.

Pourquoi ce blog ?

Pour permettre à nos consultants et experts techniques de partager leurs connaissances et retours d’expérience autour des sujets qui les passionnent. Ce blog, intégralement écrit par eux, a pour vocation d’être un véritable lieu d’échanges et d’apprentissage.

Alors n’hésitez pas à commenter nos articles pour rejoindre la conversation !

Une suggestion ?

Si vous avez des idées pour améliorer ce blog, nous sommes à l’écoute de vos remarques. Vous pouvez nous écrire via le formulaire de contact qui se trouve en bas de page.

Bonne visite !