Successfully reported this slideshow.
Devoxx France 2016
GruntJs In Action
Sarah Buisson
1
Plan
2
●
Introduction
●
Grunt & Maven
●
Live Coding
– Plugin de base et hello World
– Bower: Gestions des dépendances
– Sa...
Des nouvelles du
Front-End
3
Injection des dépendances
Effets de bords
Compatibilité
inter-navigateur
Css monolithique
Com...
Des nouvelles du
Front-End
4
Injection des dépendances
Effets de bords
Compatibilité
inter-navigateur
Css monolithique
Com...
Build & Front-End
5
Complexification du front-end.
→ Necéssité d'un outil de build
Avantages & Inconvénients de Grunt
Maven & Grunt
6
7
Step 1 : <goal>create-resources</goal>
Initialise
8
Step 2 : <goal>npm</goal>
Installe les
dépendances
du build
Step 3 : <goal>grunt</goal>
Task:MavenPrepare /src/ma
Task:[…] /target-grunt
Task:mavenDist /target-gru
Step 3 : <goal>grunt</goal>
Task:MavenPrepare /src/main/webapp/static /target-grunt
Task:[…] /target-grunt /target-grunt/d...
Live Coding
11
– Plugin de base et hello World
– Bower: Gestions des dépendances
– Sass
– Jasmine & CasperJs : Tests autom...
Merci de votre
attention
12
BackStopJS
Prochain SlideShare
Chargement dans…5
×

Devoxx France : GruntJs In Action

256 vues

Publié le

Nouvelles librairies, nouveau frameworks, nouveau langages... le front de nos applications n'a cessé de se complexifier au cours des 10 dernières années. Ce Tool-in-Action va vous montrer comment GruntJs et ses nombreux plugins permettent de simplifier et d'automatiser le build de la partie front de vos applications Web Java.

Publié dans : Technologie
  • Soyez le premier à commenter

Devoxx France : GruntJs In Action

  1. 1. Devoxx France 2016 GruntJs In Action Sarah Buisson 1
  2. 2. Plan 2 ● Introduction ● Grunt & Maven ● Live Coding – Plugin de base et hello World – Bower: Gestions des dépendances – Sass – Jasmine & CasperJs : Tests automatisés du front – Browserify : ● Modularisation ● Transpilation
  3. 3. Des nouvelles du Front-End 3 Injection des dépendances Effets de bords Compatibilité inter-navigateur Css monolithique Compatibilité inter-device Versionning des dépendances Régréssions
  4. 4. Des nouvelles du Front-End 4 Injection des dépendances Effets de bords Compatibilité inter-navigateur Css monolithique Compatibilité inter-device Versionning des dépendances Régréssions
  5. 5. Build & Front-End 5 Complexification du front-end. → Necéssité d'un outil de build Avantages & Inconvénients de Grunt
  6. 6. Maven & Grunt 6
  7. 7. 7 Step 1 : <goal>create-resources</goal> Initialise
  8. 8. 8 Step 2 : <goal>npm</goal> Installe les dépendances du build
  9. 9. Step 3 : <goal>grunt</goal> Task:MavenPrepare /src/ma Task:[…] /target-grunt Task:mavenDist /target-gru
  10. 10. Step 3 : <goal>grunt</goal> Task:MavenPrepare /src/main/webapp/static /target-grunt Task:[…] /target-grunt /target-grunt/dist Task:mavenDist /target-grunt/dist /target/main/static
  11. 11. Live Coding 11 – Plugin de base et hello World – Bower: Gestions des dépendances – Sass – Jasmine & CasperJs : Tests automatisés du front – Browserify : ● Modularisation ● Transpilation
  12. 12. Merci de votre attention 12 BackStopJS

×