Les actualités du Samedi 28 décembre 2013 dans les métiers du web - Marmits.com - Reims

Le: 28 12 2013 à 19:32 Framablog Auteur: Goofy

Le travail intellectuel des programmeurs souffrirait-il d’un manque de visibilité et de reconnaissance aux yeux d’une logique managériale qui cherche à mesurer le travail effectif avec des critères dépassés ? C’est ce que laisse entendre ce témoignage qui au détour d’une plaisante anecdote met l’accent sur un relatif malaise d’une profession qu’il est difficile de cerner de l’extérieur, et même de l’intérieur d’une entreprise.

Are Your Programmers Working Hard, Or Are They Lazy? article paru sur le blog de l’auteur

Traduction Framalang : sinma, goofy, KoS

Vos programmeurs travaillent-ils dur, ou sont-ils fainéants ?

par Mike Hadlow

Quand quelqu’un effectue une tâche physique, il est facile d’évaluer à quel point il travaille dur. Vous pouvez le voir physiquement en mouvement et en transpiration. Vous pouvez aussi voir le résultat de son travail : le mur de briques s’élève, le trou dans le sol devient plus profond. Reconnaître et récompenser un dur labeur est un instinct assez fondamental chez l’être humain, c’est l’une des raisons pour lesquelles nous trouvons les sports d’endurance si fascinants. Cette reconnaissance d’un dur travail physique devient un problème quand on l’applique à la gestion de personnes qui travaillent à des activités techniques ou créatives. Souvent, les travailleurs intellectuels efficaces n’ont pas l’air de travailler très dur.

En 2004, j’étais développeur junior dans une grande équipe qui s’occupait du système de fourniture et de facturation d’une entreprise de télévision par câble. Comme tous les grands systèmes, il était constitué de plusieurs unités relativement indépendantes dont s’occupaient des personnes ou des équipes différentes. Les départements de TV analogiques et numériques étaient presque entièrement séparés, pris en charge par des équipes différentes.

L’équipe de la TV analogique avait décidé de fonder son système autour d’une pré-version de Microsoft Biztalk. Quatre gars de chez nous et une équipe de Microsoft le développaient et le faisaient tourner en production. Ils avaient tous l’air de travailler très dur. On les voyait souvent travailler tard dans la nuit et pendant le weekend.

Chacun laissait tomber ce qu’il était en train de faire si un problème survenait en production, ils se réunissaient souvent autour du bureau d’un type, faisaient des suggestions pour régler ce qui n’allait pas, ou pour réparer quelque chose. L’activité était permanente, et tout le monde pouvait voir non seulement qu’il y avait un véritable esprit d’équipe, mais que tout le monde travaillait très très dur.

L’équipe chargée de la TV numérique était tout à fait différente. Le code avait été, en majorité, écrit par une seule personne que l’on appellera Dave. Il était développeur de maintenance junior dans l’équipe. Au départ, j’ai eu beaucoup de difficultés à comprendre le code. Au lieu d’une seule longue procédure dans un endroit précis où tout le travail se serait effectué, il y avait des tas de petites classes et méthodes avec seulement quelques lignes de code. Plusieurs collègues se plaignirent que Dave rendait les choses extrêmement compliquées. Mais Dave me prit sous son aile et me conseilla de lire quelques livres sur la programmation orientée objet. Il m’apprit les patrons de conception, les principes SOLID, et les tests unitaires. Le code commença alors à avoir du sens, et plus je travaillais dessus plus j’appréciais l’élégance de sa conception. Il ne posait pas de problème en phase de production, il ronronnait dans son coin et faisait le boulot. Il était assez facile d’opérer des modifications dans le code, du coup l’implémentation de nouvelles fonctionnalités se faisait souvent sans aucun problème. Les tests unitaires permettaient de trouver la plupart des bugs avant la mise en production.

Le résultat de tout cela est que nous n’avions pas l’air de travailler très dur du tout. Je rentrais chez moi à 18h30, je ne travaillais jamais pendant les weekends, nous ne passions pas des heures attroupés autour du bureau de quelqu’un d’autre pour deviner le problème avec un quelconque système planté en production. De l’extérieur, notre tâche devait sembler beaucoup plus facile que celle des gens de la TV analogique. En vérité, les exigences étaient très similaires, mais nous avions un logiciel mieux conçu et implémenté, et une meilleure infrastructure de développement, notamment les tests unitaires.

La direction fit savoir que des augmentations seraient accordées sur la base de nos performances. Quand ce fut mon tour de parler au directeur, il expliqua qu’il était normal que les augmentations soient accordées à ceux qui travaillaient vraiment dur, et que l’entreprise ne semblait pas importer beaucoup à notre équipe, au contraire de ces héros qui lui consacraient leurs soirées et leurs weekends.

photo par nic’s events - CC BY-SA 2.0

Cette entreprise était l’un des rares laboratoires où l’on pouvait comparer directement les effets d’une bonne ou d’une mauvaise conception logicielle et le comportement d’une équipe. La plupart des organisations ne permettent pas une telle comparaison. Il est très difficile de dire si ce type, transpirant sang et eau, travaillant tard les soirs et weekends, constamment sur la brèche, fait preuve d’une grande volonté pour faire fonctionner un système vraiment très complexe, ou s’il est simplement nul. Sauf si vous pouvez vous permettre d’avoir deux ou plusieurs équipes concurrentes travaillant à résoudre le même problème, mais bon, personne ne fait ça, on ne saura donc jamais. Et au contraire, le type assis dans son coin, travaillant de 9 heures à 17 heures et qui semble passer beaucoup de temps à lire sur internet ? Est-il très compétent pour écrire un code stable et fiable, ou son boulot est-il plus facile que celui des autres ? Pour l’observateur moyen, le premier travaille vraiment dur, pas le second. Travailler dur c’est bien, la paresse c’est mal, n’est-ce pas ?

Je dirais qu’avoir l’air de travailler dur est souvent un signe d’échec. Le développement logiciel est souvent mal fait dans un environnement sous pression et dans lequel on est souvent interrompu. Ce n’est généralement pas une bonne idée de travailler de longues heures. Quelquefois, la meilleure façon de résoudre un problème est d’arrêter d’y penser, d’aller prendre l’air, ou encore mieux, de prendre une bonne nuit de sommeil et de laisser faire notre subconscient. Un de mes livres favoris est « A Mathematician’s Apology » (traduit sous le titre L’apologie d’un mathématicien) par G. H. Hardy, un des mathématiciens anglais les plus importants du XXe siècle. Il y décrit sa routine : quelques heures de travail le matin suivies par un après-midi à regarder le cricket. Il dit qu’il est inutile et contre-productif d’effectuer un travail mental intensif plus de quatre heures par jour.

photo par sfllaw - CC BY-SA 2.0

J’aimerais dire aux manageurs de juger les gens en regardant leurs résultats, leurs logiciels qui tournent bien, et non en regardant si les programmeurs ont l’air de travailler dur. C’est contre-intuitif, mais il est sans doute préférable de ne pas vous assoir tout près de vos développeurs, vous pourrez ainsi avoir une meilleure idée de ce qu’ils ont produit, sans être affecté par des indicateurs conventionnels ou intuitifs. Le travail à distance est particulièrement bénéfique ; vous devez apprécier vos employés pour leur travail, plutôt que par la solution de facilité qui consiste à les regarder assis à leur bureau 8 heures par jour, martelant de façon lancinante sur leur IDE, ou se pressant autour du bureau des autres pour offrir des suggestions « utiles ».

Le: 28 12 2013 à 13:37 Alsacreations.com - Actualités Auteur: Raphael

Bower

Vous êtes intégrateur ou développeur front-end ? Vous avez envie de vous faciliter la vie tout en étant quelque peu allergique à la ligne de commande (un peu comme moi en fait) ?

Vous adorez votre job mais vous croulez sous le nombre de tâches répétitives qui vous empêchent de vous concentrer sur votre coeur de métier ?

Alors sachez que Bower fait partie d'une panoplie de services de nouvelle génération destinés à automatiser un maximum de tâches à votre place.

Le boulot de Bower, un outil développé par l'équipe de Twitter, est de gérer les dépendances de votre projet.

C'est quoi une dépendance ?

Laissez-moi deviner : lorsque vous débutez un nouveau projet, votre première tâche est de créer (ou de copier-coller) l'arborescence de vos fichiers et dossiers.

Votre mission suivante est d'aller visiter un par un les sites incontournables pour votre projet : jQuery, Modernizr, Bootstrap, etc. et d'installer les nouvelles versions de ces outils… ou alors de mettre à jour vos propres modules l'un après l'autre.

Avouez que vous gagneriez de précieux instants à ne plus vous soucier de ce genre de tâches répétitives quotidiennes.

Eh bien figurez-vous que ça tombe bien : tous les outils tels que jQuery, Modernizr ou Bootstrap sont des dépendances que Bower va vous aider à installer en une ligne de code !

La liste des dépendances inscrites dans le registre de Bower est pour le moins impressionnante, et parmi lesquelles vous trouverez un bon nombre de célébrités :

  • Twitter Bootstrap
  • jQuery
  • html5boilerplate
  • font-awesome
  • modernizr
  • html5shiv
  • normalize
  • jQuery mobile
  • grunt
  • purecss
  • respond
  • raphael
  • zepto
  • phonegap
  • yepnope
  • … knacss

Une base de NodeJS et Git

Deux pré-requis sont nécessaires au bon fonctionnement de Bower : Node.js (et son manager NPM), ainsi que Git.

Si vous avez déjà compris ce que cela implique, ne prenez pas cet air apeuré : je suis passé par là moi aussi et je m'en suis sorti presque indemne.

Il est vrai que vous allez devoir ouvrir votre console et taper quelques lignes de commande.

NodeJS

Installer NodeJS et Git

Sans trop de surprise, vous trouverez les liens d'installation de Node.js sur… le site de Node.js.

L'installation de Git pour tous les systèmes, quant à elle, se passe via le site http://git-scm.com/downloads. Il y a d'autres liens d'installation de Git possibles sur Windows mais celle-là est recommandée et surtout c'est celle que j'ai choisi d'utiliser :)

Note pour Windows : lors de l'installation de Git, vous aurez trois alternatives. Choisissez la deuxième afin d'inscrire Git dans les variables d'environnement du système (voir plus loin).

GitWindows

Ces deux modules essentiels étant installés, on va pouvoir passer aux choses sérieuses.

You shall not PATH !

À ce stade, il est primordial de vérifier que les modules NPM et Git sont bien répertoriées dans les Variables d'Environnement (PATH) de votre système d'exploitation.

À titre d'exemple, sur Windows, ces données se trouvent dans Système > Paramètres système avancés > Variables d'Environnement.

Vérifiez que la variable PATH contient les chemins vers NPM et Git, par exemple ainsi :

C:\Users\***\AppData\Roaming\npm; C:\Program Files (x86)\Git\bin

Si tel n'est pas le cas, il faut ajouter ces chemins au sein de la variable en la modifiant.

PATH

Bravons la ligne de commande !

Il est temps à présent d'ouvrir la console, qui se révèle indispensable pour installer et exécuter Bower. Cela va bien se passer, promis.

Si vous êtes sur Windows, il vous suffit de passer par le menu Démarrer > Exécuter et d'y taper simplement cmd, et valider.

Installer Bower

Votre console ouverte, l'installation de Bower s'exécute en une simple instruction :

npm install -g bower

C'est tout.

Bower en action !

À présent prêt à l'emploi, Bower va vous permettre d'installer, de mettre à jour ou de désinstaller toutes les dépendances qui vous semblent nécessaires à vos projets.

Ouvrez la console et positionnez le chemin sur votre dossier de projet. Le plus simple est de commencer à écrire "cd " puis de glisser votre dossier directement dans la console (voir illustration animée).

cmd.exe

Charger une dépendance

Nous allons à présent installer notre première dépendance. Il s'agira - au hasard - de KNACSS, le mini framework CSS.

Dans la console, positionnez-vous sur votre dossier de travail et exécutez simplement :

bower install knacss

L'ensemble du projet Github KNACSS, à sa dernière version, se verra automatiquement téléchargé et installé dans un dossier "bower_components" de votre projet ! (Dans l'illustration animée suivante, le dossier KNACSS est généré dans un répertoire "/inc")

install bower

Pour savoir quelles autres dépendances peuvent être ainsi automatiquement récupérées, il suffit de vérifier leur existence dans le répertoire de Bower.

Pour installer une dépendance dans une version précise, ce n'est guère plus compliqué. Il suffit de préciser la version souhaitée à la suite d'un dièse (#) :

bower install knacss#2.9.1

Mettre à jour une dépendance

Pour mettre à jour une ou plusieurs dépendances de votre projet, l'ordre à donner est update :

bower update knacss

Il est également possible de gérer plusieurs dépendances à la fois.

Pour cela, la création d'un fichier bower.json contenant toutes les informations requises est nécessaire.

Voici un exemple-type de fichier JSON :

{
	"name": "projet",
	"dependencies": {
		"knacss": "latest",
		"html5shiv": "latest",
		"box-sizing-polyfill": "latest",
		"modernizr": "latest",
		"jquery": "1.10.2"
	}
}

Pour en savoir plus sur la configuration du fichier bower.json, n'hésitez pas à consulter le fichier Google Drive "Bower Specs".

Voici en image comment installer toute une liste de dépendances en quelques secondes :

bower install 2

Modifier le chemin par défaut

Le chemin par défaut d'installation des dépendances est bower_components.

Vous pouvez modifier cette destination en créant un fichier dédié que vous devrez nommer .bowerrc et qui se trouvera dans le voisinage de bower.json.

Voici un exemple de contenu de .bowerrc indiquant à Bower que les fichiers à gérer se trouvent dans le répertoire "inc" :

{
  "directory": "inc/"
}

Conclusion

Bien que pratique et rapide, Bower n'en demeure pas moins un "simple" gestionnaire de dépendances : il n'est pas prévu pour construire des dossiers de projets complets, ni pour concaténer ou minifier des ressources. Pour ce genre d'aspirations, et pour aller plus loin, il vous faudra lorgner du côté d'autres outils tels que Yeoman ou Grunt.

Mais ceci est une autre histoire…

jack bower

Retrouvez l'intégralité de ce tutoriel multi-pages en ligne

Le: 28 12 2013 à 13:37 Alsacreations.com - Apprendre Auteur: Raphael

Bower

Vous êtes intégrateur ou développeur front-end ? Vous avez envie de vous faciliter la vie tout en étant quelque peu allergique à la ligne de commande (un peu comme moi en fait) ?

Vous adorez votre job mais vous croulez sous le nombre de tâches répétitives qui vous empêchent de vous concentrer sur votre coeur de métier ?

Alors sachez que Bower fait partie d'une panoplie de services de nouvelle génération destinés à automatiser un maximum de tâches à votre place.

Le boulot de Bower, un outil développé par l'équipe de Twitter, est de gérer les dépendances de votre projet.

C'est quoi une dépendance ?

Laissez-moi deviner : lorsque vous débutez un nouveau projet, votre première tâche est de créer (ou de copier-coller) l'arborescence de vos fichiers et dossiers.

Votre mission suivante est d'aller visiter un par un les sites incontournables pour votre projet : jQuery, Modernizr, Bootstrap, etc. et d'installer les nouvelles versions de ces outils… ou alors de mettre à jour vos propres modules l'un après l'autre.

Avouez que vous gagneriez de précieux instants à ne plus vous soucier de ce genre de tâches répétitives quotidiennes.

Eh bien figurez-vous que ça tombe bien : tous les outils tels que jQuery, Modernizr ou Bootstrap sont des dépendances que Bower va vous aider à installer en une ligne de code !

La liste des dépendances inscrites dans le registre de Bower est pour le moins impressionnante, et parmi lesquelles vous trouverez un bon nombre de célébrités :

  • Twitter Bootstrap
  • jQuery
  • html5boilerplate
  • font-awesome
  • modernizr
  • html5shiv
  • normalize
  • jQuery mobile
  • grunt
  • purecss
  • respond
  • raphael
  • zepto
  • phonegap
  • yepnope
  • … knacss

Une base de NodeJS et Git

Deux pré-requis sont nécessaires au bon fonctionnement de Bower : Node.js (et son manager NPM), ainsi que Git.

Si vous avez déjà compris ce que cela implique, ne prenez pas cet air apeuré : je suis passé par là moi aussi et je m'en suis sorti presque indemne.

Il est vrai que vous allez devoir ouvrir votre console et taper quelques lignes de commande.

NodeJS

Installer NodeJS et Git

Sans trop de surprise, vous trouverez les liens d'installation de Node.js sur… le site de Node.js.

L'installation de Git pour tous les systèmes, quant à elle, se passe via le site http://git-scm.com/downloads. Il y a d'autres liens d'installation de Git possibles sur Windows mais celle-là est recommandée et surtout c'est celle que j'ai choisi d'utiliser :)

Note pour Windows : lors de l'installation de Git, vous aurez trois alternatives. Choisissez la deuxième afin d'inscrire Git dans les variables d'environnement du système (voir plus loin).

GitWindows

Ces deux modules essentiels étant installés, on va pouvoir passer aux choses sérieuses.

You shall not PATH !

À ce stade, il est primordial de vérifier que les modules NPM et Git sont bien répertoriées dans les Variables d'Environnement (PATH) de votre système d'exploitation.

À titre d'exemple, sur Windows, ces données se trouvent dans Système > Paramètres système avancés > Variables d'Environnement.

Vérifiez que la variable PATH contient les chemins vers NPM et Git, par exemple ainsi :

C:\Users\***\AppData\Roaming\npm; C:\Program Files (x86)\Git\bin

Si tel n'est pas le cas, il faut ajouter ces chemins au sein de la variable en la modifiant.

PATH

Bravons la ligne de commande !

Il est temps à présent d'ouvrir la console, qui se révèle indispensable pour installer et exécuter Bower. Cela va bien se passer, promis.

Si vous êtes sur Windows, il vous suffit de passer par le menu Démarrer > Exécuter et d'y taper simplement cmd, et valider.

Installer Bower

Votre console ouverte, l'installation de Bower s'exécute en une simple instruction :

npm install -g bower

C'est tout.

Bower en action !

À présent prêt à l'emploi, Bower va vous permettre d'installer, de mettre à jour ou de désinstaller toutes les dépendances qui vous semblent nécessaires à vos projets.

Ouvrez la console et positionnez le chemin sur votre dossier de projet. Le plus simple est de commencer à écrire "cd " puis de glisser votre dossier directement dans la console (voir illustration animée).

cmd.exe

Charger une dépendance

Nous allons à présent installer notre première dépendance. Il s'agira - au hasard - de KNACSS, le mini framework CSS.

Dans la console, positionnez-vous sur votre dossier de travail et exécutez simplement :

bower install knacss

L'ensemble du projet Github KNACSS, à sa dernière version, se verra automatiquement téléchargé et installé dans un dossier "bower_components" de votre projet ! (Dans l'illustration animée suivante, le dossier KNACSS est généré dans un répertoire "/inc")

install bower

Pour savoir quelles autres dépendances peuvent être ainsi automatiquement récupérées, il suffit de vérifier leur existence dans le répertoire de Bower.

Pour installer une dépendance dans une version précise, ce n'est guère plus compliqué. Il suffit de préciser la version souhaitée à la suite d'un dièse (#) :

bower install knacss#2.9.1

Mettre à jour une dépendance

Pour mettre à jour une ou plusieurs dépendances de votre projet, l'ordre à donner est update :

bower update knacss

Il est également possible de gérer plusieurs dépendances à la fois.

Pour cela, la création d'un fichier bower.json contenant toutes les informations requises est nécessaire.

Voici un exemple-type de fichier JSON :

{
	"name": "projet",
	"dependencies": {
		"knacss": "latest",
		"html5shiv": "latest",
		"box-sizing-polyfill": "latest",
		"modernizr": "latest",
		"jquery": "1.10.2"
	}
}

Pour en savoir plus sur la configuration du fichier bower.json, n'hésitez pas à consulter le fichier Google Drive "Bower Specs".

Voici en image comment installer toute une liste de dépendances en quelques secondes :

bower install 2

Modifier le chemin par défaut

Le chemin par défaut d'installation des dépendances est bower_components.

Vous pouvez modifier cette destination en créant un fichier dédié que vous devrez nommer .bowerrc et qui se trouvera dans le voisinage de bower.json.

Voici un exemple de contenu de .bowerrc indiquant à Bower que les fichiers à gérer se trouvent dans le répertoire "inc" :

{
  "directory": "inc/"
}

Conclusion

Bien que pratique et rapide, Bower n'en demeure pas moins un "simple" gestionnaire de dépendances : il n'est pas prévu pour construire des dossiers de projets complets, ni pour concaténer ou minifier des ressources. Pour ce genre d'aspirations, et pour aller plus loin, il vous faudra lorgner du côté d'autres outils tels que Yeoman ou Grunt.

Mais ceci est une autre histoire…

jack bower

Retrouvez l'intégralité de ce tutoriel multi-pages en ligne

Le: 28 12 2013 à 10:13 Webdesigner Depot Auteur: Jerry King

Every week we feature a set of comics created exclusively for WDD. The content revolves around web design, blogging and funny situations that we encounter in our daily lives as designers. These great cartoons are created by Jerry King, an award-winning cartoonist who’s one of the most published, prolific and versatile cartoonists in the world […]

    






Le: 28 12 2013 à 09:34 cssdesignawards.com

Single page website with illustrated wishes for Christmas and New Year.

Le: 28 12 2013 à 09:08 WebdesignerNews Auteur: Cameron

Zotonic is an open-source framework for full-stack web development, from front-end to back-end. It’s powered by Erlang, allowing it to be fault tolerant and have excellent performance.

Le: 28 12 2013 à 06:22 jqueryrain.com Auteur: Admin

jQuery plugin that turns a jQueryUI menu widget into a context menu. Define menus from <ul> element or definition list (i.e. [{title: "Paste", cmd: "paste"}, ...]). Themable using jQuery ThemeRoller. […]

Le: 28 12 2013 à 06:10 jqueryrain.com Auteur: Admin

A simple jQuery Plugin for cover an item by another item with dragging ability.

Le: 28 12 2013 à 06:02 jqueryrain.com Auteur: Admin

Create a div with purpose as your background .. activate plugin; animated or reactive as the user scrolls. The plugin automatically will fix the div so it works seemlessly. N.b […]