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.

1. Du JavaScript dans
votre Usine Logiciel
Christophe Jollivet

2. Christophe Jollivet
• Neurobiologiste
• Informaticien
• Communautaire
• @jollivetc

3. Usine logicielle
• Construire le livrable
• compilation / dépendances
• packaging
• Exécution des tests
• Génération de métriques / doc

5. La solution de facilité
• drop les fichiers dans webapp
• quelques tests Selenium...

6. Intégration
• « A la Java »
• « A la JavaScript »

7. « A la Java »

8. Jasmine
• Framework de Test
• TestRunner

9. FeedBack Continue
• Testem
• capture de navigateur
• exécution en continue

10. Testem dans Jenkins

11. Jasmine dans Maven
• Jasmine-maven-plugin

12. Maven Tools for
JavaScript Developers
• http://mojo.codehaus.org/javascript-maventools/
• Fourni
• Tests
• Minification
• JSLint
• Archetype

13. <build>
<extensions>
! <extension>
!
<groupId>org.codehaus.mojo</groupId>
!
<artifactId>javascript-maven-plugin</artifactId>
! ! <version>2.0.0-alpha-1</version>
! </extension>
</extensions>
</build>

14. WebJar
• Dépendances transitives des librairies JS
• container Servlet3 compatible
• compatible SBT, Maven, Gradle, Leiningen

15. WebJar

16. WebJar
• Les WebJars sont dans WEB-INF/lib

17. WebJar
• Les WebJars sont dans WEB-INF/lib
• ce qui est sous META-INF/resources d’un
JAR sour WEB-INF/lib est accessible

18. WebJar
• avantages
• dépendances transitives
• pas dans le SCM
• Inconvénients
• IDE ne fait pas de complétion

19. « A la JavaScript »

20. A la JavaScript
• Ecosystème d’outils
• NPM, Grunt, Bower

21. A la JavaScript
A
Ecosystème d’outils FR
•
E
R
U
• NPM, Grunt, Bower
T
IN
E
P
E
H
IC

22. NPM
• Node Package Module
• installation d’outils et de plugins
• Permet l’installation d’outils de façon
globale

23. NPM
• Installation par
• MSI
• pkg
• make install
• Installeur pour Jenkins

25. Grunt
• The JavaScript Task Runner
• version 0.4.1

26. Installation
npm install -g grunt-cli

27. configuration
• package.json
• Gruntfile.js ou Gruntfile.coffe

28. package.json
• project metadata
• Grunt plugins as devDependencies

29. 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"
}
}

30. package.json
• npm install
• npm install <module> --save-dev

31. Gruntfile.js
• Il comprend
• la fonction wrapper
• configuration du projet et tâches
• chargement plugins et tâches
• tâches personnalisées

32. 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']);
};

33. CLI
• grunt <task>
• grunt --help

34. Istanbul
• Couverture de test

35. Plato
• Analyse de source JavaScript

36. JsDuck
• Documentation
• syntaxe à la JavaDoc
• Support de Markdown

38. Yeoman
• Yo : scaffolding
• Grunt : build, preview, test...
• Bower : dependency management

39. Yo
• Scaffolding
• installation interactive de Generator

41. Bower
• package manager for the web

42. installation
npm install -g bower

43. Configuration
• bower.json
• .bowerrc

44. Utilisation
• bower install
• bower install <package>
• bower install <package>#<version>

45. Utilisation
• bower list
• bower search

46. bower.json

47. Yeoman-maven-plugin
• configuration clean et war plugin
• Intégration dans le cycle Maven

48. Sonar

49. Sonar
• Plugin dans SonarQube
• Sonar-runner
• sonar-project.properties
• Complexe sur des projets mixtes

50. Conclusion
• http://addyosmani.com/blog/making-maven-grunt/
• 3 solutions
• Code séparé
• ignorer outillage moderne
• Maven-exec plugin

51. Questions ?
https://github.com/jollivetc/JugSummerCamp