Task-runner

Lancer un projet avec Yeoman !

Dans des précédents billets je vous ai présenté les plugins Gulp  que j’utilise et mon workflow Gulp.

Maintenant je vais vous parler de Yeoman.

Yeoman est est un outil qui vous permet de  faciliter la création et la gestion d’une application web : génération du projet, squelette, téléchargement les librairies,  compilation et mise en place d’un véritable workflow.

Bref, vous l’aurez compris, Yeoman est un outil vous permettant de gagner en productivité dès le lancement de votre projet et lors de la phase de dev.

Yeoman se base sur un système de générateurs pour tous types de projets web : WordPress, AngularJS, plugins JQuery…

Yeoman est composé de trois outils :

  • Yo construit votre application et génère sa structure
  • Built système : système de construction pour lancer, prévisualiser et tester votre projet. (Gulp ou Grunt)
  • Package manager : gestionnaire de package permettant la gestion des dépendances (Bower ou npm)

Je vous invite à consulter http://yeoman.io/ pour en savoir plus pour installer Yeoman.

Je vais vous présenter un générateur pour web-app basé sur Gulp.

Générateur pour web-app

Ce générateur vous permet de lancer votre application en quelques minutes.

Inclus : HTML5 Boilerplate, jQuery et gulpfile

En option : Sass, Bootstrap, Modernizr

installer globalement le generator :

npm install --global generator-gulp-webapp

Se mettre dans le dossier et taper la commande :

yo gulp-webapp

Votre structure est en place avec la configuration dans le gulpfile.

Le dossier app/ est pour la phase de dev. Pour démarrer le serveur et développer votre app, tapez :

gulp serve

Pour mettre en prod et builder un livrable :

gulp build

Les fichiers sont générés (minifiés et concaténés) sont dans le dossier dist/.

Un dossier est également prêt à l’usage.

Une fois que l’on a testé Yeoman on ne peut plus s’en passer !

3 réponses à “Lancer un projet avec Yeoman !

      1. Oui merci.
        Pour l’instant je me crée un Gulpfile avec bootstrap, etc….là ou je pêche c’est ce gulpfile-critical-css, ça me fait des erreurs même avec critical….mais bon ça va venir..
        Bonne soirée

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *