Présentation et retour d'expérieuce sur node.js + AngularJS au journal Le Monde, novembre 2014. Présenté dans le cadre d'un « apéro techno » chez Omnilog.

1. APÉRO TECHNO - 21 NOVEMBRE 2014
NODE.JS +
ANGULARJS
AU JOURNAL LE MONDE
Par Yves-Emmanuel Jutard
0

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

3. LIENS
Blog
Github
Wiki technique perso
http://offirmo.net/
https://github.com/Offirmo
http://offirmo.net/wiki/
http://www.yves-emmanuel.jutard.com/

4. BLEEDING EDGE EN 2014 ?
1ères versions en 2009
Font encore le buzz (même si ça se calme)

5. BLEEDING EDGE ?
Qu'est-ce qui est si bien ?
Qu'est-ce qui n'est pas si bien ?
Est-ce pour moi ?

6. PLAN
1.
2.
3.
4.
5.
Contexte
node.js
AngularJS
Bonnes pratiques au Monde
Opinions et conclusions
+ questions à volonté !

7. QUI SONT LES PIONNIERS EN
FRANCE ?
NOUVELLE APPLI ÉDITORIALE "LE 8"

8. Nouveau système éditorial. Fusion des éditions :
print = journal papier
numérique = site web, mobiles, tablettes...

9. DÉMO

11. (NOTES)
Technos utilisées

12. "LE 8" : DÉFIS
appli critique le résultat est tiré à ~
charge
utilisateurs exigeants
462 000 exemplaires quotidiens

13. 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

14. (NOTES)
"The world's most misunderstood language"
"the new lingua franca"
"Will JavaScript take over the programming world?"
"Why JavaScript Will Become The Dominant Programming
Language Of The Enterprise"

15. 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

16. (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

17. LE NOUVEAU VENU
interpréteur javascript tout neuf by google
(2008)
open source, performant

18. …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)
=

19. (LIENS)
http://nodejs.org/
Des applications ultra-rapides avec Node.js
http://www.nodebeginner.org/
mes notes

20. micro-framework :
ligne de commande :

21. 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)

22. (NOTES)
MICROSERVICES
http://fr.slideshare.net/xgorse/klubup-forumphp-join
http://martinfowler.com/articles/microservices.html

23. 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 »

24. 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 »

25. 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 »

26. RÉFÉRENCES
EBAY
++push, real-time

27. 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

28. (LIENS)
Farewell Node.js

29. PENDANT CE TEMPS, LE
FRONT-END...
de plus en plus complexe
passe lui aussi au dynamique, connecté
"un nouveau framework par jour"

30. INTRODUCING...
pour appli cliente propre et organisée

31. (LIENS)
Site officiel http://angularjs.org/
mes notes
Ultimate guide to learning AngularJS in one day
learn angular by building a gmail clone

32. inclusions dans le HTML
Résultat :

34. 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 !

35. TESTABLE ?
testable en test unitaire
rapide
accès au DOM (phantomJS)
testable en e2e (selenium + protractor)

36. TESTABLE ?
DÉMO

41. gros framework
beaucoup de concepts à intégrer

42. (NOTES)

43. 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

44. (LIENS)
All About Angular 2.0
Angular 2 Core
« While massive changes [about the web] have happened in
the last couple of years, they pale in comparison to what's
coming in the next 1-3 years » ( Rob Eisenberg
)

45. NODE + ANGULAR = MAGIE ?
La techno aide, mais la solidité est dans les bonnes
pratiques.

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

47. GESTION DE PROJET
dès la conception
personnas, API first, expert UX...

48. CODE LINTING

49. CODE REVIEW

50. TESTS UNITAIRES

51. TESTS E2E

52. INTÉGRATION CONTINUE

53. DÉPLOIEMENT ROULANT

54. SUPERVISION

55. 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

56. THE END
QUESTIONS + MERCI À TOUS !!