Industrialisation des
développements en
JavaScript
Éric Bellemon
@haklop
Alter Way
Solutions Linux 2014
• Écrire du code
• Tester son code
• Intégration continue
• Déploiement
2
Industrialisation en JavaScript
Écrire du code
3
• Normes d’écriture commune à
toute l’équipe
• indentation
• accolade
• encodage / terminaison de
lignes
• …
• Détecter le...
5
Organiser son code
• AMD / CommonJS
• Frontend
• requirejs
• browserify
• Backend
• nodejs
6
Organiser son code
• Utilisation des patterns
• Séparation des concepts
• Injection de dépendances
• Observateur
• …
• Réutilisation des libr...
• Frontend : Bower (bower.io)
• Backend : NPM (npmjs.org)
8
Gérer ses dépendances
9
Gérer ses dépendances
Bower NPM
Tester son code
10
• Garantie qu’une fonction répond à un contrat
• Indispensable sur les fonctions publiques
• Évite les régressions
11
Test...
• Multitudes de librairies en JavaScript
• Mocha (visionmedia.github.io/mocha)
• Jasmine (jasmine.github.io)
12
Tests unit...
13
Tests unitaires
• Permets de tester une application de bout en bout
• Teste toutes les couches de l’application
• Peux être complexe à met...
• CasperJS (casperjs.org)
• WebKit (Safari, Chrome)
• Gecko (Firefox)
• Selenium (seleniumhq.org)
• Supporte tous les navi...
16
CasperJS
• Complexe à mettre en place
• Utilisation de librairies qui simplifie son usage
• WebDriver (webdriver.io)
• Nightwatch (n...
18
Selenium
Intégration continue
19
• Optimisation du code
• Validation du code
• Minification et concaténation du code
• Injection des dépendances
• Exécution...
• Grunt (gruntjs.com)
• Gulp (gulpjs.com)
21
“Builder” son JavaScript
• Permet d’automatiser tout et n’importe quoi
• Équivalent de Ant et de Make
• Configuration en JavaScript
• Écosystème ext...
23
Grunt
• Serveur d’intégration continue
(jenkins-ci.org)
• Lancement automatique du
build et des tests
• Affichage des métriques
•...
Déployer son code
25
26
AUTOMATISEZ
• Attention au cache navigateur !
• Prévoir un système de rollback
• Changer le nom des fichiers à chaque version
27
Fronte...
28
Frontend
Merci de votre attention
29
Prochain SlideShare
Chargement dans…5
×

Solutions Linux 2014 – Alter Way : Industrialisation des développements en JavaScript

478 vues

Publié le

Industrialisation des développements JavaScript

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
478
Sur SlideShare
0
Issues des intégrations
0
Intégrations
20
Actions
Partages
0
Téléchargements
10
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Solutions Linux 2014 – Alter Way : Industrialisation des développements en JavaScript

  1. 1. Industrialisation des développements en JavaScript Éric Bellemon @haklop Alter Way Solutions Linux 2014
  2. 2. • Écrire du code • Tester son code • Intégration continue • Déploiement 2 Industrialisation en JavaScript
  3. 3. Écrire du code 3
  4. 4. • Normes d’écriture commune à toute l’équipe • indentation • accolade • encodage / terminaison de lignes • … • Détecter les bugs et les erreurs classiques au plus tôt • JSHint • JSLint 4 Écrire du code de qualité
  5. 5. 5 Organiser son code
  6. 6. • AMD / CommonJS • Frontend • requirejs • browserify • Backend • nodejs 6 Organiser son code
  7. 7. • Utilisation des patterns • Séparation des concepts • Injection de dépendances • Observateur • … • Réutilisation des librairies et bibliothèques existantes • Ember, AngularJS • Handlebars, Moustache • … 7 Ne pas réinventer la roue
  8. 8. • Frontend : Bower (bower.io) • Backend : NPM (npmjs.org) 8 Gérer ses dépendances
  9. 9. 9 Gérer ses dépendances Bower NPM
  10. 10. Tester son code 10
  11. 11. • Garantie qu’une fonction répond à un contrat • Indispensable sur les fonctions publiques • Évite les régressions 11 Tests unitaires
  12. 12. • Multitudes de librairies en JavaScript • Mocha (visionmedia.github.io/mocha) • Jasmine (jasmine.github.io) 12 Tests unitaires
  13. 13. 13 Tests unitaires
  14. 14. • Permets de tester une application de bout en bout • Teste toutes les couches de l’application • Peux être complexe à mettre en place 14 Tests fonctionnels
  15. 15. • CasperJS (casperjs.org) • WebKit (Safari, Chrome) • Gecko (Firefox) • Selenium (seleniumhq.org) • Supporte tous les navigateurs 15 Tests fonctionnels
  16. 16. 16 CasperJS
  17. 17. • Complexe à mettre en place • Utilisation de librairies qui simplifie son usage • WebDriver (webdriver.io) • Nightwatch (nightwatchjs.org) • WD (admc.io/wd) 17 Selenium
  18. 18. 18 Selenium
  19. 19. Intégration continue 19
  20. 20. • Optimisation du code • Validation du code • Minification et concaténation du code • Injection des dépendances • Exécutions des tests 20 “Builder” son JavaScript
  21. 21. • Grunt (gruntjs.com) • Gulp (gulpjs.com) 21 “Builder” son JavaScript
  22. 22. • Permet d’automatiser tout et n’importe quoi • Équivalent de Ant et de Make • Configuration en JavaScript • Écosystème extrêmement riche • Communauté très active 22 Grunt
  23. 23. 23 Grunt
  24. 24. • Serveur d’intégration continue (jenkins-ci.org) • Lancement automatique du build et des tests • Affichage des métriques • Déploiement des applications 24 Jenkins
  25. 25. Déployer son code 25
  26. 26. 26 AUTOMATISEZ
  27. 27. • Attention au cache navigateur ! • Prévoir un système de rollback • Changer le nom des fichiers à chaque version 27 Frontend
  28. 28. 28 Frontend
  29. 29. Merci de votre attention 29

×