0
Du JavaScript dans
votre Usine Logiciel
Christophe Jollivet
Christophe Jollivet
• Neurobiologiste
• Informaticien
• Communautaire
• @jollivetc
Usine logicielle
• Construire le livrable
• compilation / dépendances
• packaging
• Exécution des tests
• Génération de mé...
La solution de facilité
• drop les fichiers dans webapp
• quelques tests Selenium...
Intégration
• « A la Java »
• « A la JavaScript »
« A la Java »
Jasmine
• Framework de Test
• TestRunner
FeedBack Continue
• Testem
• capture de navigateur
• exécution en continue
Testem dans Jenkins
Jasmine dans Maven

• Jasmine-maven-plugin
Maven Tools for
JavaScript Developers
• http://mojo.codehaus.org/javascript-maventools/

• Fourni
• Tests
• Minification
• ...
<build>
<extensions>
! <extension>
!
<groupId>org.codehaus.mojo</groupId>
!
<artifactId>javascript-maven-plugin</artifactI...
WebJar
• Dépendances transitives des librairies JS
• container Servlet3 compatible
• compatible SBT, Maven, Gradle, Leinin...
WebJar
WebJar
• Les WebJars sont dans WEB-INF/lib
WebJar
• Les WebJars sont dans WEB-INF/lib
• ce qui est sous META-INF/resources d’un
JAR sour WEB-INF/lib est accessible
WebJar
• avantages
• dépendances transitives
• pas dans le SCM
• Inconvénients
• IDE ne fait pas de complétion
« A la JavaScript »
A la JavaScript
• Ecosystème d’outils
• NPM, Grunt, Bower
A la JavaScript
A
Ecosystème d’outils FR
•
E
R
U
• NPM, Grunt, Bower
T
IN
E
P

E
H
IC
NPM
• Node Package Module
• installation d’outils et de plugins
• Permet l’installation d’outils de façon
globale
NPM
• Installation par
• MSI
• pkg
• make install
• Installeur pour Jenkins
Grunt
• The JavaScript Task Runner
• version 0.4.1
Installation

npm install -g grunt-cli
configuration
• package.json
• Gruntfile.js ou Gruntfile.coffe
package.json
• project metadata
• Grunt plugins as devDependencies
package.json
{
"name": "my-project-name",
"version": "0.1.0",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-jshin...
package.json
• npm install
• npm install <module> --save-dev
Gruntfile.js
• Il comprend
• la fonction wrapper
• configuration du projet et tâches
• chargement plugins et tâches
• tâches...
Gruntfile.js
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('pack...
CLI
• grunt <task>
• grunt --help
Istanbul

• Couverture de test
Plato

• Analyse de source JavaScript
JsDuck
• Documentation
• syntaxe à la JavaDoc
• Support de Markdown
Yeoman
• Yo : scaffolding
• Grunt : build, preview, test...
• Bower : dependency management
Yo
• Scaffolding
• installation interactive de Generator
Bower

• package manager for the web
installation

npm install -g bower
Configuration
• bower.json
• .bowerrc
Utilisation
• bower install
• bower install <package>
• bower install <package>#<version>
Utilisation
• bower list
• bower search
bower.json
Yeoman-maven-plugin
• configuration clean et war plugin
• Intégration dans le cycle Maven
Sonar
Sonar
• Plugin dans SonarQube
• Sonar-runner
• sonar-project.properties
• Complexe sur des projets mixtes
Conclusion
• http://addyosmani.com/blog/making-maven-grunt/
• 3 solutions
• Code séparé
• ignorer outillage moderne
• Mave...
Questions ?
https://github.com/jollivetc/JugSummerCamp
JavaScript dans l'usine logicielle
JavaScript dans l'usine logicielle
JavaScript dans l'usine logicielle
JavaScript dans l'usine logicielle
Upcoming SlideShare
Loading in...5
×

JavaScript dans l'usine logicielle

997

Published on

Slide for my presentation at JugSummerCamp about integration of JavaScript in software factory. First trying to use Java Tools like Maven, then embrassing JavaScript Tools like Grunt and Bower.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
997
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
14
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "JavaScript dans l'usine logicielle"

  1. 1. Du JavaScript dans votre Usine Logiciel Christophe Jollivet
  2. 2. Christophe Jollivet • Neurobiologiste • Informaticien • Communautaire • @jollivetc
  3. 3. Usine logicielle • Construire le livrable • compilation / dépendances • packaging • Exécution des tests • Génération de métriques / doc
  4. 4. La solution de facilité • drop les fichiers dans webapp • quelques tests Selenium...
  5. 5. Intégration • « A la Java » • « A la JavaScript »
  6. 6. « A la Java »
  7. 7. Jasmine • Framework de Test • TestRunner
  8. 8. FeedBack Continue • Testem • capture de navigateur • exécution en continue
  9. 9. Testem dans Jenkins
  10. 10. Jasmine dans Maven • Jasmine-maven-plugin
  11. 11. Maven Tools for JavaScript Developers • http://mojo.codehaus.org/javascript-maventools/ • Fourni • Tests • Minification • JSLint • Archetype
  12. 12. <build> <extensions> ! <extension> ! <groupId>org.codehaus.mojo</groupId> ! <artifactId>javascript-maven-plugin</artifactId> ! ! <version>2.0.0-alpha-1</version> ! </extension> </extensions> </build>
  13. 13. WebJar • Dépendances transitives des librairies JS • container Servlet3 compatible • compatible SBT, Maven, Gradle, Leiningen
  14. 14. WebJar
  15. 15. WebJar • Les WebJars sont dans WEB-INF/lib
  16. 16. WebJar • Les WebJars sont dans WEB-INF/lib • ce qui est sous META-INF/resources d’un JAR sour WEB-INF/lib est accessible
  17. 17. WebJar • avantages • dépendances transitives • pas dans le SCM • Inconvénients • IDE ne fait pas de complétion
  18. 18. « A la JavaScript »
  19. 19. A la JavaScript • Ecosystème d’outils • NPM, Grunt, Bower
  20. 20. A la JavaScript A Ecosystème d’outils FR • E R U • NPM, Grunt, Bower T IN E P E H IC
  21. 21. NPM • Node Package Module • installation d’outils et de plugins • Permet l’installation d’outils de façon globale
  22. 22. NPM • Installation par • MSI • pkg • make install • Installeur pour Jenkins
  23. 23. Grunt • The JavaScript Task Runner • version 0.4.1
  24. 24. Installation npm install -g grunt-cli
  25. 25. configuration • package.json • Gruntfile.js ou Gruntfile.coffe
  26. 26. package.json • project metadata • Grunt plugins as devDependencies
  27. 27. package.json { "name": "my-project-name", "version": "0.1.0", "devDependencies": { "grunt": "~0.4.1", "grunt-contrib-jshint": "~0.6.3", "grunt-contrib-nodeunit": "~0.2.0", "grunt-contrib-uglify": "~0.2.2" } }
  28. 28. package.json • npm install • npm install <module> --save-dev
  29. 29. Gruntfile.js • Il comprend • la fonction wrapper • configuration du projet et tâches • chargement plugins et tâches • tâches personnalisées
  30. 30. Gruntfile.js module.exports = function(grunt) { // Project configuration. grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), uglify: { build: { src: 'src/<%= pkg.name %>.js', dest: 'build/<%= pkg.name %>.min.js' } } }); // Load the plugin that provides the "uglify" task. grunt.loadNpmTasks('grunt-contrib-uglify'); // Default task(s). grunt.registerTask('default', ['uglify']); };
  31. 31. CLI • grunt <task> • grunt --help
  32. 32. Istanbul • Couverture de test
  33. 33. Plato • Analyse de source JavaScript
  34. 34. JsDuck • Documentation • syntaxe à la JavaDoc • Support de Markdown
  35. 35. Yeoman • Yo : scaffolding • Grunt : build, preview, test... • Bower : dependency management
  36. 36. Yo • Scaffolding • installation interactive de Generator
  37. 37. Bower • package manager for the web
  38. 38. installation npm install -g bower
  39. 39. Configuration • bower.json • .bowerrc
  40. 40. Utilisation • bower install • bower install <package> • bower install <package>#<version>
  41. 41. Utilisation • bower list • bower search
  42. 42. bower.json
  43. 43. Yeoman-maven-plugin • configuration clean et war plugin • Intégration dans le cycle Maven
  44. 44. Sonar
  45. 45. Sonar • Plugin dans SonarQube • Sonar-runner • sonar-project.properties • Complexe sur des projets mixtes
  46. 46. Conclusion • http://addyosmani.com/blog/making-maven-grunt/ • 3 solutions • Code séparé • ignorer outillage moderne • Maven-exec plugin
  47. 47. Questions ? https://github.com/jollivetc/JugSummerCamp
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×