express

• Utilisation de http.Server avec les améliorations suivantes :
  1. Routage des url par chemin et verbe HTTP
  2. Parsage des paramètres d'entrée
  3. Gestion des fichiers statiques
  4. Templating HTML
  5. Et c'est tout !
• Mécanisme de middlewares pour ajouter des fonctionnalités

Anatomie du serveur

• const express = require('express');
  const app = express();
  
  app.get('/:name', (req, res) => {
    res.send('Hello ' + req.params.name);
  });
  
  app.listen(3000, () => {
    console.log('Example app listening on port 3000!');
  });

• Les routes peuvent contenir des paramètres
• req étend http.IncomingMessage
• res étend http.ServerResponse

Les middlewares

• Liste de fonctions à exécuter pour chaque requête, dans l'ordre où elles sont définies
• Par exemple:

  (req, res, next) => {
    next();
  };

• Un middleware peut:
  • modifier la requête ou la réponse
  • répondre immédiatement au client et stopper le traitement de la requête
  • émettre une erreur
• Plein de middlewares ! http://expressjs.com/en/resources/middleware.html

Le middleware d'erreur

• appelé en cas d'erreur (appel à next() avec une erreur en paramètre)
• par exemple:

  (err,req, res, next) => {
    res.status(500).send('an error occured');
  };

• le paramètre next est obligatoire (même s'il n'est pas utilisé)

Utilisation d'un middleware

• app.use([path,] function [, function...]):

  app.use((req, res, next) => {
    console.log('start request %s %s', req.method, req.originalUrl);
    next();
  });

• app.get(path, function [, function...]):

  app.get('/hello', (req, res, next) => {
    res.send('Hello world!')
  });

• existe pour toutes les methodes: post(), put()...

Express !

1. Créez un serveur express dans un module tps/express/server.js.
2. Ajouter les fonctionnalités suivantes avec les tests associés (dans un fichier tps/express/test/server.js)
   1. Le serveur démarre et renvoit une 404 sur n'importe quelle url
   2. Le serveur répond 'Hello XXX' quand on appelle l'URL '/hello/XXX', l'utilisateur pouvant remplacer XXX par le prénom de son choix
   3. Le serveur répond une erreur 400 si le prénom passé en paramètre fait moins de 3 caractères. La réponse sera en JSON et le message d'erreur sera dans une propriété 'message'
   4. Logguer toutes les requêtes en utilisant morgan (pas de test à faire)
3. Bonus: Utiliser un moteur de template pour que l'URL '/hello/XXX' retourne une page au format HTML

"Pyramid of Doom" ??

fs.readdir(source, (err, files) => {
  if (err) {
    console.log('Error finding files: ' + err)
  } else {
    files.forEach((filename, fileIndex) => {
      console.log(filename)
      gm(source + filename).size((err, values) => {
        if (err) {
          console.log('Error identifying file size: ' + err)
        } else {
          console.log(filename + ' : ' + values)
          aspect = (values.width / values.height)
          widths.forEach((width, widthIndex) => {
            height = Math.round(width / aspect)
            console.log('resizing '+filename+'to '+height+'x'+height)
            this.resize(width, height).write(destination+'w'+width+'_'+filename,
              (err) => {
                if (err) console.log('Error writing file: ' + err)
              })
          }.bind(this))
        }
      })
    })
  }
})

Asynchronisme et tableaux

• Appliquer un traitement asynchrone à un tableau

  async.map(['file1','file2','file3'], (file, next) => {
    // appliqué de manière asynchrone sur tous les éléments du tableau
    // la signature de next est next(err, result)
    fs.readFile(file, next);
  }, (err, results) => {
    // err est la première erreur renvoyée
    // results est le tableau (ordonné) des résultats intermédiaires
  });

• Tous les traitements sont déclenchés en parallèlemapLimitmapSeries
• Le callback de fin est déclenché... à la fin
• Le premier échec déclenche le callback de fin, et ignore les résultats en cours

Asynchronisme et functions

• Gérer un flow de fonctions asynchrones

  async.parallel([
    (done) => {
      // la signature de done est done(err, result)
      fs.readFile('in.txt', done);
    }, (done) => {
      fs.writeFile('out.txt', 'finished !', done);
    }
  ], (err, results) => {
      // err est la première erreur renvoyée
      // results est le tableau (ordonné) des resultats intermédiaires
  });

• Tous les traitements sont déclenchés en parallèleparallelLimitseries
• Le callback de fin est déclenché à la fin,
  ou suite au premier échec

async.parallel({
  one: (done) => {
    // la signature de done est done(err, result)
    fs.readFile('in.txt', done);
  }, two: (done) => {
    fs.writeFile('out.txt', 'finished !', done);
  }
], (err, results) => {
    // err est la première erreur renvoyée
    // results reprends les clé de l'objet initial: {one: '', two: ''}
});

Asynchronisme et functions

• whilst(), doWhilst(): executer une function asynchrone tant que le test synchrone est vrai
• until(), doUntil(): executer une function asynchrone jusqu'a ce que le test synchrone soit vrai
• seq(), compose(), waterfall(): passe les résultats de l'étape N à l'étape N+1
• queue(), cargo(): pool d'exécution asynchrone
  

Utiliser async

1. Maintenant que tps/fs/fs_utils.js est testé, nous allons le refactoriser
2. Refactorisez l'implémentation de getDirStat en utilisant async
3. TODO test avec des fonctions, 20 minutes

Une promesse ?

• Classe présente dans Javascript (ES6, NodeJS >= 6.5.0)
• Le constructeur : new Promise((resolve, reject) => { ... });
  • resolve() doit être appelé en cas de succès (accepte en paramètre le résultat du traitement)
  • reject() doit être appelé en cas d'erreur (accepte en paramètre l'erreur)
• Le prototype contient les méthodes :
  • then() définit une fonction appelée lors que la promesse est résolue
  • catch() définit une fonction appelée lors que la promesse est rejetée

Une promesse ? L'exemple

• Création de la promesse

  const request = require('request');
  const getHello = () => {
  return new Promise((resolve, reject) => {
    request('http://google.com/', (err, res) {
      if(err) {
        reject(err);
        return;
      }
      resolve(res);
    });
  });

Une promesse ? L'exemple

• Utilisation de la promesse

  getHello().then((res) => {
    console.log(res.statusCode);
  })
  .catch((err) => {
    console.log(err);
  })
  

Les états de la promesse

• source : MDN

Le chaînage

• Exécution en série

  doSomething().then(function(result) {
    // doSomethingElse retourne une promesse
    return doSomethingElse(result);
  })
  .then(function(newResult) {
    // doThirdThing retourne une promesse
    return doThirdThing(newResult);
  })
  .then(function(finalResult) {
    console.log('Got the final result: ' + finalResult);
  })
  .catch(failureCallback);
            

• Chaînage possible si la fonction dans then() retourne une promesse
• Equivalent pour les promesses de async.series()
• source : MDN

Promesses : autres outils

• Promise.all
  • Accepte en paramètre un tableau de promesses
  • Permet d'exécuter plusieurs promesses en parallèle
  • Retourne une promesse, rejetée à la première erreur, ou résolue quand toutes les promesses en entrée sont résolues
  • Equivalent pour les promesses de async.parallel()
• A partir de NodeJS 8 : util.promisify() et util.callbackify() pour convertir des fonctions "callback-style" en fonction "promise-style" et inversement

async

• A partir de NodeJS 8
• async est un nouveau mot-clé à placer devant une déclaration de fonction
• La fonction va alors retourner une promesse qui sera
  • rejetée si une erreur survient
  • résolue avec le résultat retourné par la fonction
• Exemple:

  const doHello = async (name) => {
    if(! name) {
      throw 'name is missing';
    }
    return `Hello ${name}`
  };

await

• await est un nouveau mot-clé à placer devant une promesse
  • si elle est résolue, son résultat est retourné
  • si elle est réjetée, une erreur survient (équivalent du throw)
• await ne peut être utilisé que dans une fonction async
• Exemple:

  const doHelloTwice = async () => {
    const hello1 = await doHello('bob');
    const hello2 = await doHello('alice');
    return `${hello1}, ${hello2}`;
  };

async/await : les avantages

• Meilleure gestion des erreurs
  • Les erreurs synchrones et asynchrones sont gérées de la même façon
• Code simplifié et plus lisible

Utiliser async/await

1. Maintenant que tps/fs/fs_utils.js est testé, nous allons le refactoriser
2. Refactorisez l'implémentation de getDirContent en utilisant async/await
3. Mettre à jour les tests :
   1. pour le test de succès : voir la documentation de mocha
   2. pour le test d'erreur, utiliser le plugin chai-as-promised
4. Bonus : refactorisez l'implémentation de getDirStat en utilisant async/await

Récap du troisième jour

• Node Package Manager
• TDD avec Mocha et Chai
• Client évolué avec Request
• Serveur évolué avec Express
• Algorithmie asynchrone avec Async

Crédits photos

• Slide 1 - Ricardo Fujii/Grudaemmim
• Slide 2 - Npm inc.
• Slide 9 - Bark
• Slide 17 - Antonio Santa-Pau Ramírez
• Slide 23 - https://www.flickr.com/photos/30474136@N07/21866574824/
• Slide 30 - Inception
• Slide 38 - Ricardo Fujii/Grudaemmim