Tweet
Tweet

Slide 1

Slide 1 text

GRUNT.JS AVANT / APRÈS 1

Slide 2

Slide 2 text

AUJOURD'HUI COMMENT TRAVAILLE UN DEV FRONT-END ? HTML CSS JS Media (images principalement) 2

Slide 3

Slide 3 text

... AVEC DIFFÉRENTS OUTILS... pré-processeur CSS optimiseurs d'images générateurs de fonts pré-processeur JS linters livereload tests docs ... 3

Slide 4

Slide 4 text

... ET DIFFÉRENTES COMMANDES sass/compass, stylus, less jpegtran, optipng... fontforge coffeescript ... 4

Slide 5

Slide 5 text

GRUNT.JS Grunt is a task-based command line build tool for JavaScript projects 5

Slide 6

Slide 6 text

LE NOM GRUNT PROVIENT DE WARCRAFT 3 Confirmé par , créateur de Grunt.js ben_alman 6

Slide 7

Slide 7 text

APRÈS GRUNT ? 1. Préprocessing ? Grunt 2. Tests ? Grunt 3. csslint ? js(h|l)int ? Grunt 4. ... 7

Slide 8

Slide 8 text

INSTALLATION (OS X/HOMEBREW) Ca ne doit pas être bien difficile de trouver pour Linux, peut être un peu plus pour Windows $ brew install node $ curl http://npmjs.org/install.sh | sh $ npm install ­g grunt­cli $ npm install grunt ­­save­dev $ npm install {what­you­want} 8

Slide 9

Slide 9 text

GRUNTFILE.JS CONFIG À LA MAKEFILE Gruntfile.js de Grunt.js Oui Grunt s'utilise lui même ! Exemple de gruntfile pour un blog jekyll par_kud 9

Slide 10

Slide 10 text

RUN ? $ grunt {task} 10

Slide 11

Slide 11 text

STELLAR LINKS Grunt.js Grunt.js sur Github 11

Slide 12

Slide 12 text

& / MAXIME THIROUIN / ENJOY ! BY @MOOX ON TWITTER GITHUB MOOX.IO 12