Cette année, comme tous les ans, Clever Age était présent à Paris Web. Cette fois-ci, cinq d’entre nous y ont assisté et souhaitent partager avec vous leurs impressions.
Avant tout, Paris Web c’est une des plus importantes, et surtout des plus anciennes, conférences francophones autour du web, de l’accessibilité et de la qualité. Ce sont les maîtres-mots de cet événement et comme tous les ans ils sont très bien mis en lumière.
Les conférences sur le Web sont de plus en plus nombreuses, ce qui complexifie forcément la recherche de sponsors pour Paris Web, donc n’hésitez pas à soutenir l’association, qui sera déjà intéressée par des sponsors pour la prochaine édition, mais aussi des bénévoles pour compléter le staff.
Cette édition 2017 accueillait une nouvelle fois quelques stars internationales du domaine, comme Lea Verou, Harry Roberts, Brad Frost ou Aaron Gustafson…
Nous n’avons pas assisté à toutes les conférences, donc vous trouverez ci-dessous nos avis sur toutes celles auxquelles nous avons pu assister. Vous retrouverez la liste complète des conférences et ateliers sur le programme en ligne.
Toutes les vidéos sont déjà disponibles sur Youtube, mais en mode brut d’enregistrement pour l’instant, issu du streaming mis en place pour que ceux qui n’ont pas pu venir en personne puissent quand même assister à toutes les conférences.
Les conférences du jeudi
Le secret de la correspondance numérique
Julien Dubedout et Laurent Chemla ont fait la comparaison avec la vie privée au moyen âge.
Éric Schmidt : « si vous faites quelque chose et que vous ne voulez pas que quelqu’un le sache, peut-être qu’il ne fallait pas le faire ».
Un petit historique sur les services de postes qui partout dans le monde ont été initiés par l’état afin de surveiller les communications entre les puissants jusqu’à s’étendre à un service pour le peuple, et donc surveiller tout le monde via l’interception de courriers. Voltaire, « le Snowden du moyen âge », le dénonçait en se moquant de la surveillance du roi.
L’index de confidentialité consiste en un ensemble de facteurs techniques, comportementaux et contextuels. TL;DR centralisation = risque pour la vie privée. Il nous faut de la pédagogie, une prise de conscience, faciliter l’usage et décentraliser.
Alors, qu’y a-t-il dans ES2020 ?
Christophe Porteneuve nous a présenté les nouveautés qui allaient apparaître dans les futures releases d’ECMAScript, mais aussi le mécanisme d’adoption de nouvelles fonctionnalités par le TC39 dans les prochaines releases annuelles de ce standard, sur lequel repose JavaScript (es2018, es2019, etc.).
La revue de code (bienveillante)
La revue de code est quelque chose que l’on pratique au quotidien dans nos métiers, la plupart du temps sous forme de Pull Request. Elle nous permet d’en apprendre plus sur notre façon de coder, sur celle des autres ainsi que sur la « culture » de l’équipe (on apprend énormément en relisant le code des autres).
Gilles Roustan nous a parlé de « bienveillance » dans la revue de code.
La revue de code étant une action commune, elle permet en effet de partager la responsabilité des erreurs, car à partir du moment où on le partage, le code n’appartient plus à personne en particulier, mais à l’équipe. On parle « du » code, et non plus de « mon » code.
Pour garder cette review bienveillante, il nous conseille :
- Essayer de faire des PR les plus petites possible pour ménager ses collègues et favoriser la relecture en détail. Plus la PR est conséquente moins les détails sont passés en revue.
- Commenter sur le fond, et non la forme. Il y a d’autres outils pour ça (linters et formaters).
- Ne pas critiquer la personne mais le code.
- Préférer le « nous » et le « on », plutôt que le « tu » et le « je ».
- Lorsque notre travail est revu par un pair, ne pas prendre les choses personnellement et rester dans une position d’apprentissage.
- Proposer au lieu de critiquer, voir même s’abstenir de faire un commentaire si on n’a rien à proposer.
La revue de code va instaurer à la fois une discussion et une écoute sur chaque élément partagé avec l’équipe, et va permettre de prendre des décisions en commun.
C’est un point de vue que nous partageons et qui est partagé par nombre des personnes avec qui nous travaillons, et c’était agréable de retrouver ce sujet abordé lors des conférences. La vision de Gilles permet d’enrichir la nôtre, et d’approfondir le sujet.
L’accessibilité numérique à l’ère de l’intelligence artificielle
La montée en puissance de l’intelligence artificielle inquiète autant qu’elle fascine, beaucoup d’usages pouvant — voire devant — changer pour en profiter. Dans cette conférence, Denis Boudreau et Élie Sloïm, experts reconnus de l’accessibilité et de la qualité, présentaient en particulier quelles avancées l’intelligence artificielle promet en matière d’accessibilité.
Ils commencent par donner quelques exemples d’utilisation, notamment sur de la reconnaissance d’images : auto description des photos sur Facebook, authentification par reconnaissance de visage chez Apple et autres, lecture labiale automatique chez IBM, etc. Ce qui est certain, c’est que ces technologies évoluent très vite, que leur fiabilité est bien plus grande qu’il y a quelques années. Les technologies de machine learning ont beaucoup progressé, et les jeux de données pour les entraîner sont de plus en plus riches et volumineux.
Sans rentrer dans le détail, Denis et Élie n’oublient pas de citer les grands enjeux moins positifs que sont la sécurité, le respect de la vie privée, les risques de dépendance, etc.
Plus spécifiquement pour le Web, ils essaient de prédire l’avenir de nos métiers, en montrant comment les IA pourraient nous remplacer sur les tâches les plus automatisables, nous amenant à devenir soit des experts sur les sujets les plus pointus, soit des enseignants pour ces IA.
Pour conclure, Denis et Élie pensent que la disparition progressive des interfaces visuelles, avec les assistants audio, va aider l’accessibilité à s’intégrer de plus en plus au sujet plus général de l’UX, à sortir des sujets trop souvent ignorés ou pris en compte trop tard.
Recreating the ZX Spectrum loader with Web APIs
Quand un geek se demande comment une ancienne technologie fonctionne en tentant de reproduire son comportement avec les API web. En l’occurrence le ZX Spectrum est un ordinateur des années 80 qui lisait des données depuis des cassettes audio à bande magnétique (oui, comme celles qu’on mettait dans l’autoradio). Les données binaires était donc déduites du signal analogique.
Remy Sharp a étudié le fonctionnement de l’appareil afin de reproduire son fonctionnement à l’aide de l’API audio de HTML5, tant pour émettre des sons que pour les écouter.
Ce fut très intéressant de suivre son aventure entre cette technologie ancestrale et les difficultés rencontrées avec la toute récente API audio qui n’avait sûrement pas encore été utilisée pour ce genre d’application.
HTML re-invented for the age of web apps
Voilà déjà quelque temps que beaucoup de développeurs se sentent dépassés par le nombre de technologies, frameworks et outils disponibles pour créer des sites et applications pour le Web, principalement dans l’écosystème JavaScript, au point de parler de JavaScript fatigue. Si vous n’êtes pas vous-même développeur front, lisez cet aperçu romancé, un peu caricatural mais pas tant que ça, de la situation : How it feels to learn JavaScript in 2016. Voyez aussi un peu plus loin notre compte-rendu de la conférence « Rendez-vous en terre inconnue » de Matthieu Bué.
Lea Verou, notamment Invited Expert dans le W3C CSS Working Group, a fait ce constat il y a déjà quelques années. Elle a alors axé son travail, au sein du groupe Haystack du prestigieux Massachusetts Institute of Technology, sur la recherche d’une solution permettant de développer des sites Web dynamiques bien plus facilement.
Le résultat est Mavo, un outil lui-même codé en JavaScript, que l’on inclus dans une page HTML, dans laquelle on peut alors utiliser des attributs spécifiques la rendant dynamique, tant pour la présentation (avec des boucles, des conditions d’affichage, etc.) que pour permettre la création/saisie d’informations, y compris l’upload d’images par exemple. Mavo peut pour cela s’appuyer sur un système de stockage sur un dépôt Github, et il est possible d’en ajouter d’autre grâce à un système de plugin. La démo avec une gestion de liste de tâches est très explicite.
La promesse est très intéressante, et la mise en œuvre semble particulièrement qualitative, ce qui n’est pas une surprise quand on connaît les nombreux projets open source précédents de Lea Verou.
Le seul bémol, avant d’avoir vraiment eu l’occasion de tester en profondeur, est que tout ce qui est dynamique se produit uniquement en JavaScript côté client, sans aucune solution de repli en cas de blocage ou plantage de JavaScript. Lea Verou balaie cette crainte en disant que le site de Mavo, lui-même développé en Mavo, est bien indexé par Google. Mais à l’heure où tous les frameworks modernes JavaScript adoptent les principes d’architectures isomorphes, avoir cette possibilité de fonctionnement avec Mavo, tant pour le SEO que pour la performance, serait vraiment un avantage. Cela impliquerait certes la nécessité d’avoir un serveur à disposition, probablement avec NodeJS.
Namaste qualité
Superbe retour d’expérience sur une équipe multiculturelle que nous présente Marie Terrier.
Celle-ci travaille pour une agence web situé en Inde avec une équipe qui a dû apprendre à jouer avec les différences d’accents, de langage corporel mais aussi de culture vis-à-vis du travail, de l’entreprise, de la qualité et du web.
Dans le web, on est souvent amené à travailler avec l’Inde et ça ne se passe pas toujours aussi facilement que l’on voudrait. Nous mettons souvent ces difficultés sur le dos de problèmes de compréhension mais tout s’explique quand on se met à la place de nos interlocuteurs en s’imprégnant de leurs culture.
La présentation passionnante et pleine d’humour de Marie accompagné de nombreux gif nous a bien fait sourire.
Lecteurs d’écran : le choc des titans
Sylvie Duchateau, est une consultante reconnue en accessibilité numérique depuis près de 20 ans. Elle est également formatrice sur l’usage du web à l’aide des lecteurs d’écran. En tant qu’utilisatrice, elle nous a partagée son retour d’expérience sur son principal outil de travail : le lecteur d’écran..
L’accessibilité est un sujet auquel nous accordons une grande importance chez Clever Age et il est toujours intéressant d’avoir une revue de l’état des avancées dans le domaine par une utilisatrice quotidienne des synthèse vocales.
Elle nous a parlé notamment des différences entre les lecteurs (JAWS / Orca / NVDA / Voice Over), des difficultés puis des gros progrès de Mac (Mac permet la lecture de PDF depuis High Sierra).
Projet perso nº42 : une aventure ultrasonique
Les projets perso, ce terrain de jeux des passionnés qui, hors du boulot, continuent à coder pour le plaisir de résoudre un problème ou découvrir une nouvelle technologie qu’ils n’ont pas forcément l’occasion de manipuler au boulot. Hubert Sablonnière fait partie de ces passionnés incompris par leur entourage, comme s’il y avait des hobbies socialement autorisés et que coder sur son temps libre n’en faisait pas partie.
Pourtant pendant ce temps libre on peut s’amuser à programmer sa domotique ou développer un jeu en web app mobile. Ça peut paraître futile mais sans contrainte de temps ou de pression professionnelle on peut laisser tout l’espace à notre côté créatif et notre curiosité.
Son projet perso, c’est tout simplement l’outil qu’il utilise pour diffuser ses slides. Pour cela il s’est amusé à tester des techno comme WebRTC qu’il n’avait jamais utilisé professionnellement.
Rendez-vous en terre inconnue
Débarquer dans un projet bien plus conséquent que prévu et rempli de techno qui nous sont inconnues, c’est le défi auquel à été confronté Matthieu Bué. Après la période d’angoisse, on reprend du poil de la bête, on prend le taureau par les cornes sans foncer tête baissée, on se plonge dans le code sans se noyer, on se remet en question tout en assumant nos choix, on trouve des solutions et avec du recul on se rend compte que dans tout ça on a surtout beaucoup appris.
La conclusion est qu’il faut ne faut pas avoir peur de sortir de sa zone de confort pour apprendre plus de nous même et nos limites, et gagner en expérience.
Conférences du vendredi
Le Green IT : facteur incontournable pour laver plus vert le web responsable
Christophe Clouzeau nous a proposé une conférence passionnante sur des questions très actuelles que de plus en plus de gens se posent. Comment rendre plus écologique le secteur informatique et internet, à l’époque où son envahissement est de plus en plus grand ?
Il a abordé un large panel d’actions que nous pourrions mettre en place pour consommer moins de ressources et diminuer le gaspillage (à noter, parmi les recommandations matérielles et d’utilisations, des outils comme https://greenspector.com/ et http://www.ecoindex.fr/ qui vont permettre de tester les sites web).
C’est un point de vue encore relativement nouveau, ou en tous cas des pratiques peu répandues actuellement, qu’il faudrait arriver à intégrer dans nos façons de travailler.
L’épopée d’une couleur
Comment une couleur navigue du monde réel à l’utilisateur qui regarde la photo sur son écran, en passant donc par l’appareil photo, le fichier informatique, le logiciel d’édition d’image, l’écran et la perception humaine. Maryla U. nous détaille tout le processus et comment la couleur est captée, encodée et perçue.
Cette conférence à la fois technique et parfaitement vulgarisée nous apprend que personne n’est égal face à la couleur.
Why Fast Matters
Harry Roberts a donné une conférence plutôt éclairante sur les performances web selon où vous êtes dans le monde.
Chez Clever Age, nous essayons toujours d’avoir les meilleures performances possibles lorsque nous travaillons sur un projet, et c’est un souci majeur que devraient avoir toutes les entreprises.
Ce à quoi nous pensons moins souvent, c’est que dans d’autres pays moins développés technologiquement, comme la Thaïlande, l’Inde… la 4G ne fait pas forcément partie du paysage, ni même la 3G d’ailleurs, et on retombe plutôt sur de la 2G. Cela relativise la notion de vitesse, et soulève pas mal de questions quand à la façon de fournir des services internet là-bas.
Un exposé vraiment intéressant, qui inévitablement pousse au questionnement sur l’avenir du web (car ces pays vont se développer), et qui permet de remettre en perspective bien des notions.
Harry Roberts en a profité pour saluer la pertinence d’une solution comme Dareboost pour faire des audits de performance ponctuels, mais surtout dans la durée. Nous utilisons nous-même Dareboost depuis pas mal de temps, sur un nombre croissant de projets.
Design et accessibilité, frères d’arme ou ennemis ?
Un sketch rafraîchissant où Julien Dubedout et Aurélien Lévy jouaient leurs propre rôle de façon caricaturale, respectivement directeur artistique et expert accessibilité.
On y trouvait tous les soucis habituel d’accessibilité que l’on peut rencontrer après les choix graphiques (contraste, lisibilité, information portée par la couleur, navigation clavier, etc.). La discussion se porte sur ce qui est en contradiction avec les bonnes pratiques et comment trouver des compromis sans saccager la charte graphique.
Ce sketch nous rappelle notre travail quotidien, même si ce sont des exemples simplistes comparé à ce qu’on peut rencontrer. Il faut continuer à sensibiliser tous les corps de métier à l’accessibilité.
J’entre dans un magasin…
Une conférence pleine d’humour et de second degré présentée par notre ancien collègue Boris Schapira qui projette les pratiques ecommerce dans un magasin physique imaginaire, ce qui est assez dérangeant, on pourrait même dire carrément flippant.
Tout ça pour sensibiliser sur les mauvaises pratiques que l’on rencontre régulièrement dans le monde e-commerce vis-à-vis des utilisateurs. Comme souvent à Paris Web on nous rappelle de penser à l’expérience utilisateur et à avoir de l’empathie.
CSS, tu peux pas test !
Tester les feuilles de style est un sujet qui nous préoccupe beaucoup chez Clever Age et c’est pour cette raison que nous nous sommes particulièrement intéressés à la présentation de Thomas Zilliox.
Il nous montre comment devrait se passer une pull request avec des tests de non-régression visuelle automatisés sur tous les navigateurs et terminaux du scope de notre projet.
Tout ceci par page et élément, afin que l’on puisse mesurer et éviter d’apporter des regression sur une page que l’on ne voulait pas impacter.
Cependant ces outils n’existent pas actuellement. C’est tout de même plaisant de voir que nous ne sommes pas les seuls à avoir ce besoin et à chercher les outils pour y répondre.
Designing the Conversation
Cette conférence de Aaron Gustafson, évangéliste accessibilité et standards Web chez Microsoft, mais aussi ancien leader du Web Standards Project (WaSP), a été l’occasion de réaffirmer l’importance d’utiliser de façon pertinente le balisage sémantique de HTML5 (qui sait vraiment quelle utilisation pertinente on peut faire de <b> en 2017 ?), afin d’en permettre la meilleure exploitation qui soit.
On pense immédiatement aux assistances techniques telles que les lecteurs d’écran utilisés par les mal-voyants et non-voyants, mais tout l’intérêt de cette conférence a été de montrer que cette forte sémantisation du Web va faciliter son exploitation par d’autres types d’assistants vocaux, tels que les futures versions de Amazon Alexa, Google Home, etc. Ces assistants seront de plus en plus capables d’aller directement chercher des réponses aux questions qu’on leur posera dans les contenus Web bien balisés, plutôt que — ou en plus de — dans des bases de connaissance structurées.
Échapper au « zombie styleguide » : 3 méthodes pour armer une équipe dans la conception de son styleguide
Le guide de style, chez Clever Garden, c’est un sujet qui nous tient à cœur. Thibault Mahe nous a présenté comment, avec son équipe, ils ont mené leur guide de style comme un projet en lui-même.
En passant par une expression de besoin puis la conception du projet qui y répond, de la mise à jour régulière aux « design token » sans oublier les contrôles qualité, Thibault a parcouru tous les points qu’il fallait contrôler afin de maintenir un guide de style vivant et pas mort-vivant.
Les ateliers du samedi
Le web à la poursuite des applications natives avec les Progressive Web Apps
Xavier Julien et Clément Dubois ont présenté un atelier de 3h consacré aux Progressive Web App.
Les Progressives Web App (ou PWA) — dont nous avons déjà parlé ici plusieurs fois — représentent une nouvelle manière de concevoir les sites web actuels. Elles se situent à mi-chemin entre une applications natives et un sites web classique.
Ce qu’elles apportent de plus comparé à un site web :
- Une gestion du cache local fine et intelligente grâce au Service Worker.
- La possibilité de naviguer en offline.
- Les push notifications
- L’ajout du site en home screen, d’un splash screen intermédiaire (écran d’attente au lancement), d’un affichage plein écran (sans les barre d’adresse, favoris, onglet, etc… du navigateur), d’un blocage d’orientation du téléphone, etc…
Pour obtenir tout cela, pas besoin de programmation en Objective-C / C# / Java ou autre langage de ce type ; la base technique d’une PWA ne change pas, c’est la même qu’un site web classique !
Pour ce faire deux fichiers sont indispensables.
Le plus simple à implémenter : le manifest.json
Il permet de préciser :
- le nom de l’application
- l’url de base
- le mode d’affichage (généralement réglé sur « fullscreen »)
- l’orientation si on souhaite bloquer l’usage au mode portrait par exemple
- la couleur de fond
- la couleur du thème (permet sur les android par exemple d’avoir une couleur de barre d’état système identique à celle de l’application)
- les icônes qui s’afficheront sur l’écran d’accueil du téléphone.
Le manifest.json est un fichier destiné aux smartphones, pour le moment seul ceux tournant sous Android le prennent en compte. Il permet d’ajouter le site sur l’écran d’accueil sous forme d’icônes d’application. Il s’ouvre alors avec un splash screen intermédiaire et en plein écran à l’instar d’une véritable application.
Cette étape est extrêmement simple et rapide à mettre en oeuvre, il serait dommage de s’en priver.
Mais le plus intéressant dans les PWA c’est la gestion du cache local, et la possibilité d’une navigation offline.
C’est là qu’entre en jeu notre deuxième fichier, celui-ci est communément appelé le « Service Worker ». Un Service Worker est un fichier .js, placé à la racine du projet, se comportant comme une sorte de Proxy, ou plutôt servant de relai entre le client et le serveur.
Sont rôle est de capter les requêtes passées au serveur et de vérifier si les informations demandées existent déjà dans le cache local — et ainsi les servir le plus rapidement possible — et dans le cas contraire d’interroger le serveur pour obtenir les informations manquantes.
Xavier et Clément nous ont expliqué comment mettre en place un Service Worker et le configurer.
Ils en ont profité pour nous démontrer que les Services Worker ont leur vie propre et s’installent parfois à notre insu dans le cache navigateur. Ce fut un moment fort de l’atelier, chacun a pu se rendre compte du nombre de Service Worker déjà installés sur son poste en suivant ces étapes :
- Ouvrir l’inspecteur
- Aller dans l’onglet Application
- Puis cliquer sur Service Workers
- Et cocher la case Show all
Vous devriez trouver une liste assez conséquente.
Ensuite Xavier et Clément nous ont expliqué de quelle manière gérer le cache et une base IndexedDB pour permettre une navigation offline.
Enfin, ils sont allés plus loin dans l’implémentation et nous ont montré comment gérer les push notifications.
Xavier et Clément ont su être à l’écoute de leur assistance, avec une courbe de progression douce et didactique. Au final, ils ont réussi à nous donner les principaux outils pour transformer un site web en Progressive Web App.
Initiation à la direction artistique pour le web
Dans cet atelier de 3h — et ce ne fut pas trop, loin de là — Julien Dubedout nous a présenté son métier de Directeur Artistique, mais surtout la chaîne créative complète, du besoin — ou l’envie — du client jusqu’à la réalisation finale pour le Web, en passant par de multiples métiers.
L’atelier était avant tout destiné aux profils qui interviennent sur les projets après le DA, donc plutôt les web designers qui déclinent l’approche du DA, et surtout les intégrateurs front end, qui transcrivent tout ça en code HTML et CSS, voire JavaScript. Le but — atteint — était de sensibiliser ces personnes au fait que ce qu’ils jugent parfois comme des délires (pour rester poli) du DA vient bien souvent de directions données par les intervenants précédents (le client lui-même, le planneur stratégique, le directeur de création, etc.), que le DA doit bien entendu suivre.
Histoire de ne pas rester théorique et limiter la pertinence de cette sensibilisation, et faire que ce soit réellement un atelier et non une conférence, Julien nous a proposé de nous mettre dans la peau de ces intervenants. Julien nous ayant proposé de travailler sur le cas de Calibre ou Framasoft, nous sommes partis sur Framasoft.
Framasoft n’était malheureusement pas au courant, ce qui limite forcément l’impact de ce que l’on a pu faire ou proposer, mais cela permettait d’avoir un cas concret connu de la majorité des participants. Framasoft a d’ailleurs annoncé quelques jours plus tard le lancement de son initiative Contributopia, pour « explorer les mondes numériques où l’humain et ses libertés fondamentales sont respectés, et ce jusque dans la conception des outils », c’est à dire en inventant de nouveaux usages et outils, plutôt qu’en continuant la course — impossible à gagner — à la copie « propre » des outils des GAFAM.
Le brief à prendre en compte contient les nombreux paramètres suivants, plus quelques autres que Julien a évité pour ne pas nous noyer, et permettre de tenir dans le temps imparti. Ces points servent de questionnaire à donner au client, pour cibler la création ensuite :
- Entreprise : Framasoft
- Produit : suite Frama Apps
- USP (Unique Selling Point, ce qui différencie des concurrents) : respect des données personnelles
- Preuves de l’USP : asso 1901, logiciels libres
- Vision : Dégoogliser Internet
- Problématique : nouveaux utilisateurs qui quittent les GAFAM
- KPI : nombre d’utilisateurs + 500 000
- Cible principale (tranche d’âge, catégorie socioprofessionnelle, etc.) : utilisateurs des GAFAM
- Cible secondaire :
- Informations disponibles sur les cibles :
- Ton (échelle de 1 à 5, de sérieux à fun) :
- Charte éditoriale
- Charte graphique
- Direction dans laquelle ne pas aller
- Contraintes juridiques pour la communication ? (Loi Évin, etc.)
- Différentes questions d’organisation : Qui décide ? Qui est impliqué ? Etc.
- Exemples que vous aimez / n’aimez pas
Le challenge a ainsi été exprimé de la façon suivante :
« Quelles actions imaginer pour inciter les gens à reprendre le contrôle de leurs données et à quitter les GAFAM ? »
Un premier exercice a été d’essayer de trouver de nombreuses reformulations du challenge, dont voici un extrait :
- Comment faire comprendre aux gens que les GAFAM exploitent leurs données ?
- Comment montrer aux gens qu’ils sont traqués sur le Web à leurs dépens ?
- Comment aux gens montrer l’usage de leurs données pour leur faire prendre conscience de la collecte ?
- Comment profiter des bannières d’info cookie pour montrer aux gens que tous les sites les traquent, via les marqueurs des GAFAMs ?
- Comment montrer aux gens que la gratuité a un coût ?
Un autre exercice a consisté à trouver des synonymes ou équivalents aux termes clefs du challenge (GAFAM, utilisateurs GAFAM, données, quitter, contrôle), façon mindmap :
L’exercice suivant a consisté à imaginer, en groupes de 4 ou 5, comment définir la communication pour atteindre cet objectif. De belles idées ont été proposées, mais il est difficile de les retranscrire ici.
Nous n’avons malheureusement pas pu aller vraiment jusqu’au bout de l’exercice, mais l’atelier a bien montré toute la complexité avec laquelle doivent se débattre les personnes créatives qui interviennent en amont de la DA, puis en DA, avant que tout cela se décline en design Web à intégrer.
Webpack comme des grand·e·s !
Atelier WebPack de 3h présenté par Christophe Porteneuve
La forte personnalité du formateur met tout de suite à l’aise, blague et sujet de troll sont abordés rapidement et aident à détendre une assistance nerveuse, connaissant la complexité du sujet abordé. Christophe Porteneuve étant connu pour aller vite, nous avons dû nous préparer à trois heures de marathon neuronal.
N’étant pas particulièrement à l’aise avec cet outil, d’où l’intérêt de notre présence à cet atelier, nous avions comme objectif de progresser dans la compréhension de WebPack.
La première question abordé est : Webpack est-il un simple task-runner ?
Réponse : non.
WebPack est souvent utilisé pour automatiser des tâches comme gulp/grunt/ant mais il est bien plus que cela.
Ses principales différences sont sa capacité à gérer les dépendances projet (sorte de bundle amélioré) et sa capacité à accepter n’importe quel type de fichier en entrée (le panel comparé à Gulp par exemple est beaucoup plus vaste).
Il est donc beaucoup plus comparable à Brunch.io
Au cours de cet atelier, Christophe nous a montré comment configurer un WebPack, de quelle manière générer des pages, appeler des scripts, appeler et « parser » des CSS (considérées comme des JS sinon), importer des images et les traiter, créer des sprites SVG, concaténer, minifier, gzipper, etc, etc…
Les points forts de Webpack :
- Il est très rapide
- Il possède un « Hot module replacement » (une super fonctionnalité qui évite d’avoir des module dépréciés et les mets à jour automatiquement, la doc WebPack le décrit comme un « LiveReload for every module »)
- Il possède une grande richesse d’optimisation
Christophe est aller assez loin au cours de ces trois heures et nous a montré une configuration avancé d’un Webpack, il nous a expliqué comment éviter de répéter du code pour respecter le principe DRY, soit « Don’t Repeat Yourself ».
Le rythme s’accélérant sensiblement sur la fin, il n’était pas forcément simple d’ingérer tous les concepts passés en revue. Mais même si elle fut intense, cette initiation fut riche en apprentissage et a permis d’entrevoir les remarquables possibilités qu’offre un outil tel que Webpack.
Conclusion
Encore une chouette édition de Paris Web pour la plupart d’entre nous, voire une grande première pour certain·es. Nous avons vraiment une nouvelle fois apprécié l’excellente ambiance entretenue par la communauté et les sujets abordés.
Nous remercions vivement les organisateurs de Paris Web de nous avoir permis une fois de plus de nous rencontrer, d’approcher quelques célébrités qui « font le web » et contribuent à l’améliorer en continu.
Ces conférences ont été très riches en enseignements, et sont les témoins de la bonne direction que prennent nos métiers.