Vagabondage de tweets – Juillet 2017 – Drupal, ReactJS, VueJS et ELM...

Contribution Drupal

13 juillet – Drupal @drupal
Contribution : un nouveau module #Drupal8 d'import des méta-données d'images - IPTC Media - Good job l'équipe ! https://t.co/K3kC7raXnN
L’Open Source c’est bien, mais c’est en contribuant que l’on assure la pérennité de ce système ! C’est avec joie que nous vous présentons l'une de nos contributions officielles Drupal avec la sortie du module IPTC Média.  Ce module étend les fonctionnalités proposées par le module Media Entity Image et permet d’extraire les métadonnées photo IPTC d’une image. Deux autres modules sont en cours de développement…en attendant testez ce module et partagez vos impressions !

Drupal

1 juillet – Christophe Dugué @chdugue
Mythes et réalité : les inconvénients supposés de #Drupal8 par @Flocondetoile : http://bit.ly/2uaqqmV  - Clair.
Drupal 8 a été le fruit d’une refonte générale drastique qui a changé les processus notamment grâce à sa nouvelle architecture. Même si la dernière version du CMS a su prouver ses atouts, cette refonte n’a pas été sans conséquences. Des défauts, vraiment ?

• Incompatibilité des modules des versions antérieures avec Drupal 8 : si les modules Drupal 7 ne sont pas compatibles avec Drupal 8, n’oublions pas que Drupal 8 garantit une compatibilité avec les versions majeures futures, notamment grâce à la rupture technologique tant sur l’architecture, sur le fonctionnel que sur les bonnes pratiques en matière de développement.

• Un écosystème plus restreint : le nombre de modules Drupal 8 est incontestablement plus maigre que celui de Drupal 7 (3000 modules Drupal 8 contre 12 000 modules Drupal 7) et notamment en raison de la différence du niveau de maturité et du périmètre fonctionnel. Cependant, Drupal 8 propose une architecture qui permet d’implémenter une logique « métier » plus facilement. De plus, certains modules Drupal proposent l’équivalent fonctionnel de plusieurs modules Drupal 7.

• Une faible adoption : nous sommes forcés de constater une difficile adoption de Drupal 8. Les raisons sont multiples : le cycle d’apprentissage plus long, moins de modules disponibles, la volonté d’attendre Drupal 9 pour procéder à la migration…

• La fin de la maintenance de Drupal 8 : la dernière version du CMS pourrait être maintenue jusqu’en 2019 et jusqu’en 2021 pour les mises à jour de sécurité mais la date de la fin de maintenance n’est pas connue à ce jour. Cependant, la migration vers les versions majeures sera moins « agressive ».

• Peu de thèmes Drupal 8 : comparé à Wordpress, il est évident que Drupal propose moins de thèmes prêts à l’emploi. Pourtant, ces thèmes peuvent s’avérer être lourds pour une application. Selon la taille du projet, réaliser un thème sur-mesure semble être une solution judicieuse pour éviter une éventuelle surcharge de l’application.

• La composition d’un contenu avec Drupal 8 : on reproche souvent le manque de pouvoir dans la structure du contenu Drupal pourtant Paragraphs est devenu le module de référence dans la structuration de contenus complexes grâce aux fonctionnalités riches qu’il propose.

• Une gestion compliquée des droits : avec presque 100 cases à cocher, la gestion des droits dans Drupal 8 n’est pas pratique. Il est possible de contourner cela grâce à des solutions notamment par la taxonomie qui permet de gérer les droits dynamiquement en fonction des attributs des contenus.

• Une administration compliquée : Drupal 8 est certes laborieux à administrer mais il propose la possibilité de concevoir un back-office sur-mesure puissant grâce à une administration technique.

• Drupal 8 est moins performant : du fait de sa nouvelle architecture et des fonctionnalités, Drupal 8 embarque plus de code. Cependant, le CMS propose un système de cache remarquablement puissant, pour les visiteurs anonymes et les utilisateurs authentifiés.

• Beaucoup de bugs : tout système complexe présente des bugs et c’est, en effet, le cas pour le système de Drupal 8. Drupal 8 a fait l’objet d’une refonte en profondeur et les nombreux bugs sont en partie liés aux modules expérimentaux. Cette politique permet d’intégrer des nouvelles fonctionnalités plus rapidement et forcément les bugs ne sont pas rares. De plus, Drupal dispose d’un bugtracker public ce qui permet à la communauté de corriger les bugs et d’échanger notamment sur les nouvelles fonctionnalités. 

• Problème de sécurité : même si 5 bulletins de sécurité dont une faille critique ont été publiés en 2016, Drupal 8 n’en reste pas moins le CMS le plus sécurisé du marché et notamment grâce à sa gestion méthodique et efficace des failles de sécurité. 

Drupal 8 n’est pas infaillible mais c’est en apprenant à connaître le CMS qu’il est possible de cerner certains aspects positifs derrière les défauts.

10 juillet – Ludovic Coullet ‏@lcoullet 
Migrating Content Translated with "Content Translation" from Drupal 7 to Drupal 8 : http://bit.ly/2uRFatt
Depuis que Drupal 8 a proposé un processus standardisé pour la gestion des traductions, beaucoup ont décidé de migrer leur site Drupal 7 vers la dernière version majeure. Dans Drupal 7, il existe deux façons de traduire le contenu :

• Utiliser le module content_translation : c’est le mode de traduction de base dans Drupal 7 où chaque traduction est un nœud distinct.

• Utiliser le module entity_translation : un nœud contient toutes les langues et les traductions ont lieu au niveau du champ.

Dans ce post, découvrez comment migrer des traductions de contenus d’un site Drupal 7 à un site Drupal 8 avec le module content_translation.

11 juillet – Ludovic Coullet ‏@lcoullet 
How to Embed Just About Anything in Drupal 8 WYSIWYG with Entity Embed and URL Embed : http://bit.ly/2uY2h3S
Intégrer des éléments multimédias (images, vidéos, contenu relié, etc.) dans la zone de texte du WYSIWYG, c'est pratique. Dans Drupal 7, plusieurs solutions ont permis de répondre tant bien que mal à ce besoin. Dans Drupal 8, la combinaison des modules Entity Embed et URL Embed semble être une solution gagnante pour intégrer n’importe quelle entité ou un contenu via l’URL. En effet, le module Entity Embed permet à toute entité d’être intégrée dans une zone de texte WYSIWYG. Quant au module URL Embed, il permet d’intégrer et d’afficher des éléments multimédia via l’URL, également dans la zone de texte de l’éditeur. Voici un tutoriel intéressant qui vous explique :

• Les solutions proposées par Drupal 8 ;

• Comment créer un bouton d’intégration dans l’éditeur WYSIWYG avec le module Entity Embed ;

• Comment intégrer des éléments multimédias avec le module URL Embed :

• Comment étendre la fonctionnalité d’intégration avec d’autres outils de l’écosystème Media.

Vous pouvez enfin enrichir vos textes !

13 juillet – Ludovic Coullet ‏@lcoullet 
User authentication in Drupal 8 - passwords
Comment fonctionne l’authentification des utilisateurs quand ces derniers se connectent sur un site Drupal 8 ? Tout commence par une route de login dans user.services.yml du module user, puis le formulaire de connexion prend et valide le nom d’utilisateur et le mot de passe grâce au service user.auth du module…mais encore ? Un coup d’œil sur cet article qui vous explique en détail comment s’opère le processus d’authentification d’un utilisateur, comment les mots de passe sont stockés, et comment fonctionne le service Password de Drupal 8… l’authentification dans Drupal 8 n’aura plus de mystère pour vous ! 

17 juillet – Ludovic Coullet ‏@lcoullet  
What Are Experimental Modules in Drupal ? http://bit.ly/2vhUxfI
En plus de la nouvelle politique en matière de gestion des versions et des évolutions fonctionnelles du core de Drupal 8, la dernière version du CMS a introduit également une nouvelle approche, celle des « modules expérimentaux ». Quel est le but de ces modules ? Les modules expérimentaux permettent aux contributeurs d’itérer sur les fonctionnalités de nouveaux modules. Ces modules ou nouvelles fonctionnalités peuvent être supportés dans une prochaine version mineure sans avoir à se conformer aux exigences rigoureuses pour les versions de production du core de Drupal.
Ainsi, cette initiative permet d’intégrer des nouvelles fonctionnalités plus rapidement dans le core de Drupal, même si toutefois, les modules expérimentaux sont ajoutés seulement dans les versions mineures en version alpha pour des tests. Une fois testés et approuvés, les modules expérimentaux peuvent intégrer le core de Drupal comme modules stables à part entière. Attention, les modules expérimentaux ne sont destinés qu’à des tests et peuvent – en cas de défaillance ou d’obsolescence- être retirés du core de Drupal dans les versions futures ! Il convient d’attendre que le module soit stable pour l’utiliser définitivement en production sous peine d’avoir de mauvaises surprises. 

20 juillet – Ludovic Coullet ‏@lcoullet 
Drupal 8.4.0 will be released October 4; alpha begins week of July 31 | Drupal Groups http://buff.ly/2tf6EG6
La prochaine version mineure Drupal 8.4.0 sortira le mercredi 4 octobre 2017, avec de nouvelles fonctionnalités, des améliorations. Vous pouvez tester la version alpha de Drupal 8.4.0 qui est disponible depuis la semaine du 31 juillet (Pour information, cette version nécessite Drush 8.1.12.). Par ailleurs, plusieurs modules expérimentaux en version alpha 8.4.X, sont en voie de devenir stables prochainement : Media, Setting Tray, Place Blocks, Inline Form Error et enfin Datetime Range. Quand à la version beta, celle-ci sera disponible rapidement avec une sortie prévue pour la semaine du 14 août.

React

1 juillet – Christophe Dugué @chdugue
Allez ! On se met à #ReactJS avec http://react.express  ! http://bit.ly/2tBr6of  - #Tuto #Mooc #FrontEnd
React est une bibliothèque pour la construction d’interfaces web puissantes avec des données dynamiques. On vous parlait de ses avantages, notamment :

• Une architecture simple et facile à comprendre.

• React confère une certaine structure du code ce qui favorise la maintenance et l’évolution, notamment grâce aux composants qui embarquent leurs propres fonctions et qui permettent de scinder l’application. Ainsi, l’application devient modulaire et permet de pouvoir ajouter ou supprimer des briques aisément.

En plus de la documentation officielle de Facebook (créateur de React), voici un guide pratique destiné aux développeurs qui maitrisent le HTML, CSS et le JavaScript et qui souhaiteraient s’initier à React.

18 juillet – Ludovic Coullet ‏@lcoullet 
Getting Started with React, Drupal 8, and JsonAPI : http://bit.ly/2wo9Y2M
Pour utiliser la librairie React sur certaines parties de votre site, il n’est pas nécessaire de découpler entièrement votre site Drupal. Il est possible d’utiliser le module JSON API de Drupal pour communiquer entre les composants React et votre site Drupal. Voici un tutoriel qui vous explique comment faire, avec comme exemple : la fonctionnalité « Favoris ». Cette fonctionnalité permet aux utilisateurs de mettre en favoris des nœuds. Ce type de fonctionnalité est généralement géré sur les sites Drupal avec le module Flag. Cependant, il est difficile de le customiser pour arriver à répondre exactement à votre besoin, sans parler des bugs… Avec les composants React, le pouvoir de customisation est plus intéressant. Découvrez comment optimiser les fonctionnalités de votre site Drupal avec React (configurer un module custom Drupal, intégrer React dans un module Drupal, créer un composant React pour Drupal).

VueJS

1 juillet – Christophe Dugué @chdugue
Pourquoi #VueJS devient si populaire : http://bit.ly/2uaK5mG  - Et peut-il chatouiller #AngularJS et #ReactJS ? Nous, on pense que OUI.
Sérieux concurrent d’Angular et de React, VueJS commence à gagner le cœur de nombreux développeurs, dont le nôtre ! En effet, les statistiques des douze derniers mois tendent à montrer que VueJS est plus utilisé que ReactJS, notamment avec plus de 150.000 téléchargements du package VuEx rien qu’en mai 2017. Pourquoi son succès ne cesse de grandir ? VueJS est un framework mature basé sur les composants pour la création d’interfaces utilisateurs. Le cœur de VueJS se concentre sur la couche de présentation et propose des fonctionnalités de templating avancées basées sur des directives. Vue.JS offre la possibilité de créer ses propres directives, composants et mixins. En bref, ses avantages font de lui un outil de choix :

• Vue.JS est simple à utiliser et facile à comprendre d’autant plus qu’il propose une documentation complète et accessible pour les débutants mais également pour les développeurs expérimentés.

• Vue.JS repose sur une approche basée sur les composants. Il y a plusieurs façons de définir les composants dont une qui est plutôt pertinente : le fichier unique. Il s’agit de définir le modèle HTML, le script et le style dans un seul fichier.

• Très réactif, Vue.JS a su prendre le meilleur de React et offre un DOM virtuel qui permet de surveiller tout changement de rendu.

• Vue.JS est très performant. En moyenne, il est deux fois plus rapide que React (respectivement 51ms contre 94ms).

• Vue.JS est flexible avec d’autres librairies pour plus de liberté dont Vuex pour la gestion des états et Vue Router pour le routage de l’application.

• Il supporte le rechargement à chaud du code, ce qui rend la programmation agréable.

• …VueJS est un framework prometteur dont on n’a pas fini d’en entendre parler !

7 juillet – Ludovic Coullet ‏@lcoullet 
Parlons #Javascript avec #VueJS qui fait trembler la planète du #dev #front, trouvez notre retour d'expérience ! http://bit.ly/2tZaojb
Grande tendance de l’année, le principe du découplage ou du « headless » a fait énormément de bruit sur la toile notamment en raison des avantages qu’il dégage. Il s’agit de séparer le back-end et le front-end, pour utiliser un framework ou une bibliothèque différente du socle technique. Nous parlons ici notamment de la tendance du découplage Drupal : où Drupal est utilisé pour le back-end et où un Framework (souvent JavaScript) motorise le front-end. Toujours à l’affût des nouveautés et surtout des solutions qui permettent d’optimiser les applications Drupal, notre équipe d’experts Drupal s’est penchée sur le sujet et s’est notamment attardée sur le framework VueJS . Ce framework a été un choix pertinent pour un projet d’envergure demandant la gestion d’un grand nombre de visites et de requêtes. En effet VueJS permet un temps d’exécution agréablement court et c’est ce niveau de performance qui nous a permis de gérer les milliers d’utilisateurs effectuant une requête au même moment par exemple. Pour aller plus loin, nous vous invitons à consulter l’intégralité de notre retour d’expérience !

Elm

6 juillet – Ludovic Coullet ‏@lcoullet 
The Structure of an Elm Application | CSS-Tricks http://buff.ly/2tl82tn  je suis content !
Les jeunes langages de programmation sont difficilement pris au sérieux, surtout pour les grands projets. Ce comportement est assez logique compte tenu des risques encourus du fait d’un manque de maturité. Pourtant, Elm a su démontrer sa performance dans les grands projets complexes.
Il est possible de créer certaines parties d’une application en Elm et d’intégrer ces composants dans une application JavaScript, comme il est possible de créer l’intégralité d’une application avec Elm. Dans cet article, vous découvrirez comment est structurée une application écrit en Elm, par les points suivants :

• L’architecture d’une application Elm ;

• Comme les fonctions init, update et view sont définies dans l’application ;

• Comment fonctionne la communication avec les API en utilisant les commandes Elm ;

• Le routage d’une single-page ;

• Le traitement des données JSON dans Elm.

Design 

12 juillet – Laurent Demontiers @L_Demontiers 
ÉNORME ! https://www.goabstract.com/  , le Git des designers permet de versionner les compos, de travailler à plusieurs sur le même fichier, etc
Ce mois-ci, nous avons eu le bonheur de tomber sur une nouvelle solution de design des interfaces : Abstract ! Cette plateforme permet de travailler le design en équipe en proposant des outils UI stables et un workflow efficace. Un peu à la manière de Git, Abstract permet de travailler sur le même fichier à plusieurs, de versionner le travail, d’échanger avec l’équipe de travail … jetons un coup d’œil sur les fonctionnalités d’Abstract :

• Gestion de fichiers : chaque projet dispose d’un fichier dit « Maître ou Master » qui représente la source du projet. Ainsi, tous vos fichiers Sketch seront reliés à ce projet.

• Système de versionning : Abstract permet le travail de plusieurs designers sur un même fichier sans écraser le travail d’un autre. Même les petits changements sont enregistrés. Chaque designer peut créer une branche à partir d’un fichier Master et y apporter des modifications. Ensuite, il est possible de procéder à la fusion des modifications.

• Contrôle des modifications : tout est sauvegardé et la fonctionnalité « commit » vous permet de savoir qui a effectué un changement. En cas de problème, vous pouvez restaurer la version précédente à tout moment.

• Les feedbacks : vous pouvez ajouter des commentaires sur les objets de votre choix et avec la mention @nom, vous êtes directement notifié. De plus, vous pouvez partager votre travail à vos collaborateurs via Abstract, visualisable directement sur le web et sans avoir à télécharger l’application.

• Intégration avec d’autres solutions : il est possible de suivre l’intégralité de design via Slack. Les outils Github et JIRA seront possibles dans un avenir proche.

Ludwig

13 juillet – Drupal @drupal
Need the power of Composer but fear the command line? Ludwig is a new module just for you https://www.drupal.org/project/ludwig  by @bojan_zivanovic
Les modules Drupal nécessitent souvent des bibliothèques PHP externes, d’autant plus que Composer ne permet pas de télécharger manuellement les bibliothèques sur le site fournisseur. Pour contourner ce problème, Ludwig peut être une alternative manuelle à Composer. En effet les modules fournissent un fichier ludwig.json qui liste toutes les bibliothèques demandées mais également les dépendances des bibliothèques. L’administrateur du site peut alors télécharger les bibliothèques à partir des liens donnés et les placer dans le fichier lib des modules. Ludwig détecte ainsi les sous-dossiers et les ajoute comme racine PSR-4 à l’autoload de Drupal.

Divers

14 juillet – Christophe Dugué @chdugue
Site #Drupal8 par @bluedrop_drupal pour le port de #Marseille : http://www.osezlej1.fr  - et quelle vidéo aérienne : https://youtu.be/QEp_XY4X_58
Voilà quelques semaines que nous vous parlions du projet de la refonte du site d’appels à projet du J1, du Grand Port Maritime de Marseille et nous vous montrons enfin le résultat d’un labeur intense ! Compte tenu des objectifs exigeants de communication sur le projet de réaménagement du hangar J1, le front-end a été un réel enjeu avec un design minutieusement travaillé et une vidéo de prises de vues aériennes par drone entièrement réalisé et monté par notre collaborateur VéProduction, spécialiste depuis 15 ans dans la réalisation et le montage de vidéo. Côté technique, rien de bien compliqué mais fidèles à Drupal nous avons quand même préconisé Drupal 8 pour le développement !