Apéro techno - 21 novembre 2014

node.js + AngularJS

au journal Le Monde

Par Yves-Emmanuel Jutard

À propos

  • Ex. développeur "corporate" C / C++
  • Migration volontaire vers le "bleeding edge"
  • Arrivée chez Omnilog en février 2014

Liens

Bleeding edge en 2014 ?


  • 1ères versions en 2009
  • Font encore le buzz (même si ça se calme)

Bleeding edge ?

  • Qu'est-ce qui est si bien ?
  • Qu'est-ce qui n'est pas si bien ?
  • Est-ce pour moi ?

Plan

  1. Contexte
  2. node.js
  3. AngularJS
  4. Bonnes pratiques au Monde
  5. Opinions et conclusions

+ questions à volonté !

Qui sont les pionniers en France ?

Nouvelle appli éditoriale "le 8"

Nouveau système éditorial. Fusion des éditions :

  • print = journal papier
  • numérique = site web, mobiles, tablettes...

Démo

(notes)

Technos utilisées

"Le 8" : défis

Javascript revolution

  • le langage le plus incompris du monde
  • accidentellement génial (comme l'ensemble du web ;)
  • déjà partout, énorme pool de développeurs

(notes)

Javascript revolution

  • un langage de script comme un autre python, ruby
  • langage interprété = productivité++ typage fort pas si utile
  • héritage prototypal = productivité++ vent de fraicheur sur l'objet
  • JSON = productivité++ au revoir XML lourd
  • closures intégrées = magie insoupçonnée

(notes)

  • même âge que ruby ! (1995)
  • ce sont les tests qui font la qualité du code
  • le tout objet est lourd et inefficace
  • ruby et python ont aussi le design pattern réacteur, mais en lib, et la std API a des I/O bloquantes
  • pendant ce temps, java discute encore de comment implémenter les closures

Le nouveau venu

  • interpréteur javascript tout neuf by google (2008)
  • open source, performant

…une lib "from scratch" au meilleur du moment :

  • design pattern réacteur intégré merci les closures
  • I/O non bloquantes merci les closures
  • modèle évènementiel
  • micro-framework souplesse, liberté
  • gestionnaire de paquet (npm, 2011)

=

(liens)

micro-framework :

ligne de commande :

  • cible le web dynamique, connecté
  • performance++ pour les serveurs
  • mono-thread = productivité++
  • APIs REST, micro-services
  • projets, code et développeurs full stack (en théorie)

(notes)

microservices

  • http://fr.slideshare.net/xgorse/klubup-forumphp-join
  • http://martinfowler.com/articles/microservices.html

références

payPal

  • migré depuis Java
  • ++ full-stack engineers
  • « The node.js app was built almost twice as fast with fewer people. Written in 33% fewer lines of code. Constructed with 40% fewer files. »
  • « Double the requests per second vs. the Java application [even when] using a single core for the node.js application compared to five cores in Java. We expect to increase this divide further. 35% decrease in the average response time »

références

Netflix

  • migré depuis Java
  • « huge gains in developer productivity »
  • « We're hoping to migrate all of that as soon as we can »

références

Groupon

  • migré depuis RoR
  • SOA, API attaquée par mobile + web
  • « We’re currently serving ~50,000rpm and our overall response times have dropped dramatically »

références

eBay

  • ++push, real-time

contre-points

  • pas pour le calcul intensif ou tâches longues
  • callback hell (promises ?)
  • API parfois brouillonne (évènement ? exception ?)
  • API non terminée, version stable encore à venir, ex. mode cluster
  • qq problèmes de stabilité ?
  • pb de gouvernance en cours

(liens)

Pendant ce temps, le front-end...

  • de plus en plus complexe
  • passe lui aussi au dynamique, connecté
  • "un nouveau framework par jour"

Introducing...

pour appli cliente propre et organisée

(liens)

inclusions dans le HTML

Résultat :

  • framework déclaratif (comme le HTML et c'est bien)
  • permet de modulariser son appli
  • solide, made by google, grosse communauté
  • prévu testable dès la conception (et c'est bien !)
  • pas parfait, mais îlot de stabilité dans le monde fou du front-end !

Testable ?

  • testable en test unitaire
    • rapide
    • accès au DOM (phantomJS)
  • testable en e2e (selenium + protractor)

Testable ?

DÉMO


  • gros framework
  • beaucoup de concepts à intégrer

(notes)

  • Attention au SEO
  • Attention aux perfs
  • DI complexe, bootstrap
  • gros concurrent qui monte : react (facebook)
  • environnement front encore instable (ES6, polymer, web components…)
  • AngularJS 2.0 proche

(liens)

node + Angular = magie ?

La techno aide, mais la solidité est dans les bonnes pratiques.

Bonnes pratiques

  • Gestion de projet
  • Code linting (jshint)
  • Code review (Github entreprise)
  • Tests unitaires
  • Tests e2e
  • Intégration continue (Jenkins)
  • Déploiement roulant
  • Supervision

Gestion de projet

  • dès la conception
  • personnas, API first, expert UX...

Code linting

Code review

Tests unitaires

Tests e2e

Intégration continue

Déploiement roulant

Supervision

Conclusions

  • technos récentes : rencontré bugs, veille nécessaire, besoin devs motivés
  • front-end encore en recherche, évolutions majeures à venir
  • promesse de code reuse moyennement tenues
  • micro-libs magiques mais versions à maintenir
  • micro-libs = créativité mais bonnes pratiques peinent à émerger
  • microservices : la prod ne suit pas
  • microservices : question organisationelles
  • agile, dette = compétence et discipline nécessaire

THE END

Questions + merci à tous !!