Actualités

[22/03/2017] Smile participe au salon Cloud Computing World Expo

Smile interviendra ce mercredi 22 mars au salon Cloud Computing World Expo pour présenter notre projet collaboratif OCCIware (plateforme standard outillée de connecteurs Cloud).

[22/03/2017] Smile vainqueur des IoT Awards 2017 !

Lors de l'IoT World à Paris, Smile a remporté l'IoT Award dans la catégorie "High-tech" pour son projet de cabine connectée avec Coved.

[17/03/2017] Smile dans le Journal de l'Emploi sur Demain TV

Géraldine Moreau-Luchaire, notre Responsable Recrutement, nous parle des 350 postes à pourvoir en 2017 !

Toutes les actualités picto
       

Vous avez besoin de mettre à jour votre Lecteur Flash Flash 7

Guillemet ouvrant l'actualité des solutions
et des technologies open source Guillemet fermant
picto

Plate-forme d’intégration continue pour projets mobiles : Build d’un projet mobile

Pour réaliser les applications mobiles de ses clients, Smile utilise généralement la plate-forme Apache Cordova (PhoneGap). Cette dernière permet de créer des applications distribuables sur les stores en utilisant les technologies du web (HTML5, CSS3 et JavaScript) et de cibler plusieurs OS avec le même cœur de développement.

La génération ou build de ces applications nécessite de nombreuses étapes qui sont à répéter à chaque fois que l’on souhaite pouvoir tester son application notamment sur smartphone réel.

Les étapes de build et leurs outils/langages associés :

  • compilation des templates (handlebars, jade, etc.);
  • compilation JavaScript (coffeeScript, etc.);
  • compilation CSS (less, sass, etc.);
  • analyse statique (jslint, csslint);
  • concaténation et minification des JavaScript et des CSS;
  • optimisation des images;
  • exécution des tests;
  • génération de la documentation;
  • packaging natif des applications;
  • archivage;
  • déploiement.

Dans cette suite d’articles nous allons voir comment mettre en place une plate-forme d’intégration continue sous Mac OS X pour les projets mobiles de type webapp et/ou Apache Cordova.

La mise en place d’une plate-forme d’intégration continue nécessite un outil de build spécifique aux projets mobiles et front-end. On souhaite qu’il réponde à nos premiers besoins qui sont:

  1. Compilation de templates handlebars
  2. Exécution de tests jasmine
  3. Génération de documentation yuidoc

Introduction à Grunt

Grunt (http://gruntjs.com/) est un outil de build, développé par Ben Alman, et basé sur Node.js (http://nodejs.org/download/).

Installation de grunt

Grunt s’installe via le package manager de Node.js:

sudo npm install -g grunt

Gruntfile

Le gruntfile est le fichier de configuration d’un projet pour grunt, il se dépose à la racine du projet sous le nom de grunt.js.

Le gruntfile commence toujours par:

module.exports = function(grunt) {}

La variable grunt donne accès à l’api grunt.

initConfig

la fonction initConfig prend pour argument la configuration des tâches du build, par exemple:

grunt.initConfig({
 min: {
{
['dist/built.js'],
 dest: 'dist/built.min.js'
 }

Ici, on configure la tâche “min” pour la cible “dist”, on prend le fichier “dist/built.js”, on le minifie et on dépose le résultat dans “dist/built.min.js”. On exécute le build avec la commande:

grunt min:dist

Si aucune cible n’est fournie, la tâche est exécutée pour toutes les cibles.

registerTask

grunt permet d’enregistrer de nouvelles tâches via la fonction “registerTask”. On peut l’utiliser pour définir un alias pour un ensemble de tâches:

grunt.registerTask(‘build’, ’lint qunit min’);

La commande “grunt build” effectue alors une analyse statistique des codes sources avec jslint, exécute les tests qunit et minifie les codes sources avec UglifyJS.

La documentation des tâches natives de Grunt est disponible ici :

https://github.com/gruntjs/grunt/blob/master/docs/toc.md#built-in-tasks.

loadTasks & loadNpmTasks

Grunt expose la fonction loadTasks qui charge des tâches depuis un répertoire:

grunt.loadTasks('tasks-directory');

Cette fonction est utile si on utilise des tâches qui ne sont pas disponibles sur npm.

La fonction loadNpmTasks permet justement de charger les tâches récupérées depuis npm:

grunt.loadNpmTasks('tasks-package');

On trouve facilement des plugins et tâches grunt sur http://gruntjs.com/.

Documentation

Pour plus d’information sur grunt:

https://github.com/gruntjs/grunt/blob/master/docs/toc.md

https://github.com/gruntjs/grunt/tree/master/docs

Conclusion

Après cette introduction à Grunt, on note que Grunt est un outil de build écrit en JavaScript et pour des projets en JavaScript.

En effet, il repose sur Node.js qui repose lui-même sur V8, le moteur JavaScript de Chrome, les bibliothèques JavaScript utilisées dans les projets front-end et mobiles sont facilement utilisables par Grunt.

Nous allons donc pouvoir nous appuyer sur cet outil pour automatiser les phases de build de nos applications.

Simon Basset
picto

Commentaires

Soyez la premiere personne à ajouter un commentaire sur cet article.
Ecrire un nouveau commentaire