JoomlaDagen 2017

https://www.joomladagen.nl

Banner

Salle plénière

La grille avec les sessions reprend une icône représentant un carré, en bas à gauche de chaque session, lorsque la présentation est disponible en ligne : https://www.joomladagen.nl/programma

1. Session d’intro

 Sander Potjer   Joomla! First

Lors de la session d’introduction au JDay 2017 NL, Sander insiste sur le fait que tout le monde est ambassadeur de Joomla! et cela commence par la livraison d’un site : il est nécessaire que le prestataire qui crée un site pour un client insiste sur la nécessité de mentionner qu’il faut faire de la maintenance, qu’il est important que le site soit suivi et mis à jour.

Sander Potjer

Il est important de bien mentionner qu’un site non mis à jour sera tôt ou tard hacké et donc, à terme, puisse nuire à la communication “Encore un site Joomla! hacké” comme on peut le voir trop souvent dans la presse et concernant des sites non maintenus.

Chacun est ambassadeur; il importe que chacun explique à son client la nécessité de prévoir les mises-à-jour.

1.1. Joomla Educatie

Une initiative pour centraliser une documentation, des tutoriels, ... concernant l’apprentissage de Joomla dans l’enseignement : http://joomlainhetonderwijs.nl/

1.2. Joostock

http://joostock.com est un évènement qui sera organisé pour la première fois aux Pays-Bas, les 7 et 8 octobre.

fa-joomla: Joomla unconference car l’idée est de ne pas proposer d’agenda mais de le constituer au fur et à mesure selon les souhaits des participants.

Joomla en Progressive Web Apps (PWA)

 Sean Van Zuidam   Joomla en Progressive Web Apps

2.1. Quelles sont les caractéristiques d’une application Web progressive :

L’aspect générique d’une application web est de réutiliser les capacités liées à l’appareil (Android, IOS, ...) comme par exemple les icônes natives et de ne pas utiliser des icônes qu’il faut alors télécharger et qui consomment donc de la bande passante.

2.2. Quelques liens

3. Regular Labs Extensies – het Zwitsers zakmes

 Peter Van Westen

Peter Van Westen

Lors de cette présentation, Peter a donné plusieurs exemples d’emploi de ses extensions...

Info : RegularLabs propose des boutons pour l’éditeur JCE qui permettent donc d’avoir un accès direct aux fonctionnalités des plugins depuis l’éditeur. Il suffit alors de cliquer sur, p.ex. le bouton sourcerer pour obtenir un écran où l’on écrit immédiatement le code PHP.

À l’utilisation, cette barre d’outils additionnelles se révèle assez pratique car il est possible de l’utiliser depuis un article comme créer un nouveau snippet sans même quitter l’écran d’édition d’un article.

3.1. Sourcerer

Il s’agit d’un plugin qui permet de placer un code PHP dans un article. Ainsi pour personnaliser une page, il suffirait d’écrire :

(documentation JUser)

pour voir s’afficher le nom de l’utilisateur connecté.

3.2. Snippets

Snippets agit comme un autotext en Word pour ceux qui connaissent, càd qu’on crée une table avec des abréviations et un texte long.

En faisant appel à l’abréviation dans un article, on récupère automatiquement le texte long.

Exemple :

Un snippet peut contenir l’appel à d’autre plugin. On peut donc mettre dans le texte long d’un snippet du code PHP qui sera exécuté au travers de sourcerer.

3.3. ReReplacer

Dans sa version Pro, on peut remplacer un texte par du code PHP qui sera exécuté (ce qui permet de se passer alors de Sourcerer).

Exemple : chercher dans la page en cours d’affichage le nom d’un utilisateur (Christophe) et le remplacer par un code PHP qui permettra d’afficher la liste des articles de cet utilisateur sous la forme de tooltip.

3.4. Content templator

On définit un texte qui peut être composé de plusieurs paragraphes, mise en page, images, ... et l’appel à un template depuis un article.

Le contenu du template est copié dans l’article ⇒ si on change le template content, l’article n’est pas mis à jour contrairement à un snippet qui lui sera mis à jour.

Dans la version Pro de Content templator on peut aller dans l’onglet Publishing qui permet de générer des boutons (Show in Editor Button) => ces boutons apparaîtront alors immédiatement dans la barre d’outils de JCE. On peut choisir l’icône et le texte du bouton.

Marc et Peter Van Western

3.5. DB Replacer

Ce composant permet de lancer une recherche au niveau de la base de données, p.ex. la liste des articles, à la recherche d’un pattern (ex http://votre-site) et de le remplacer par autre chose (ex https://votre-site ou juste //votre-site). En une seule opération donc pour remplacer, dans tous les articles de votre site, les appels à des ressources en http:// vers https:// pour ne plus avoir du mixed content une fois que vous aurez activé un certificat SSL sur votre site.

3.6. Modules anywhere

Permet d’afficher un module dans un article p.ex. ou encore dans un autre module (qui permet l’affichage d’une zone html personnalisée).

Ainsi, p.ex., on peut très facilement reprendre dans le contenu d’un article le module de connexion.

Note : nativement Joomla permet aussi de récupérer des modules dans un article; Modules anywhere propose toutefois plus de fonctionnalités.

En combinant Sourcerer, on peut ajouter un code PHP qui ferait un random pour définir un module ID (p.ex. en utilisant la fonction array_rand()). Sourcerer génèrerait alors un tag où module_ID est donc dérivé aléatoirement. (on peut travailler soit sur l’ID du module soit sur son titre)

3.7. Tab

{tab Tab Title 1}
    The text for the first tab...
{tab Tab Title 2}
    The text for the second tab...
{/tabs}

3.8. Articles anywhere

Combiné à Tabs, on peut créer des onglets sur base de p.ex. la liste des articles d’une certaine catégorie.

4. AMP – Accelerated Mobile Pages

 Simon Kloostra  Amp in Joomla

www.ampproject.org

Simon Kloostra

AMP est une façon de construire son contenu static pour un rendu plus rapide. Il s’agit de la réponse de Google face aux Instants Articles de Facebook. Les pages AMP sont des pages statiques dont le but est de viser un affichage extrêmement rapide. Les pages AMP sont cachées depuis Google.com; il n’y a donc plus d’appels vers le site propriétaire (Google mentionne toutefois l’URL du site).

Trois composants :

GTMetrix : Simon donne l’exemple d’une page sur un site en live, l’affichage prend 9 secondes. L’appel à la même page mais avec l’extension .amp (et non plus .html) a pris 2 secondes soit un temps divisé par 4 (de même que le poids de la page qui était de 800Ko et qui est passé à 200ko). Troisième tentative : appel à la page depuis google.com et là, le temps d’affichage était 1 seconde.

4.1. Duplicate content

Non, parce que la page AMP reprend un tag canonical qui référence le domaine propriétaire; le tag pointant vers l’article au format HTML.

4.2. AMP or not ??

L’utilisation de AMP ne convient pas à tout; il y a des situations où AMP ne devrait pas être utilisé : lire https://www.semrush.com/blog/to-amp-or-not-to-amp-what-is-best-for-your-website/ pour quelques conseils.

4.3. Pour quels types de sites ??

AMP vise les pages statiques, sans interactions et donc sans formulaires p.ex.

4.4. Implémentation

4.5. Plugins

Il existe deux plugins pour Joomla, Simon recommandant le premier :

4.6. Remarques

Il faut également se poser la question sur l’utilisation qu’on souhaite faire des pages AMP càd souhaite-t-on que l’utilisateur reste sur les pages AMP (et donc sur google.com puisqu’elles sont desservies depuis le cache de Google) ou veut-on que les utilisateurs, s’ils naviguent sur la page AMP soit redirigés sur la version mobile du site.

4.7. Validations

5. Configuration d’un environnement de développement en local

 Michiel Verhoef

Michiel Verhoef

Vagrant is a tool for building and distributing development environments.

5.1. Quelques liens

5.2. Installation

D’abord installer Virtual box puis Vagrant et ensuite choisir une box :

5.3. Tutoriel d’installation étape par étape

https://www.joomlatools.com/developer/tools/vagrant/

5.4. PuPhet

https://puphpet.com/

A simple GUI to set up virtual machines for Web development.

6. Don’t stop to learn

 Stefan Koopmanschap

Stefan relate son histoire de programmeur depuis PHP 3.x jusqu’à aujourd’hui en appuyant sur la nécessité de toujours apprendre mais, surtout, de s’entourer de la communauté Open Source : trouver des groupes d’entre-aide, un coach/mentor, des testeurs, ... De se fixer d’objectifs et de trouver les moyens de les atteindre.

7. Security, pourquoi une fois encore ??

 Koen Sandbrink

Koen Sandbrink

https://www.rijksoverheid.nl

Koen travaille pour le ministère de la Sécurité et de la Justice. La section téléchargement du site du ministère permet de trouver quantité de documents (en Néerlandais) sur la sécurité des applications web, sur le cybercrime.

8. Deconstructing a monster query

 Eli Aschkenasy

Eli Aschkenasy

8.1. Index

Mettre un index sur p.ex. “CountryCode” n’est peut-être pas le plus opportun car si 80% de la table reprend des records pour le pays BE, un index sur CountryCode force à traverser 80% de la table autant dire que l’index ne sert pas à grand-chose.

Par contre, si on a un index combiné sur “CountryCode+City”, on isole davantage les records et la portée de l’index, donc son intérêt est plus grand.

8.2. Covering indexes

Lors de la création d’un index combiné, il est préférable de mettre les champs sur lesquels on va faire la recherche au début. Exemple : Country+Gender+City n’est peut-être pas le plus intelligent mais City+Country+Gender davantage car il y a davantage de villes que de pays que de genre. L’index a plus d’intérêt à être construit de cette manière.

Boosting performance with coverage indexes!

8.3. Group By

Group by va générer des fichiers temporaires et ralentir l’exécution du query. Si cela n’est pas nécessaire, éviter les group by.

8.4. Range lookup

L’utilisation d’un range lookup ne permet plus d’utiliser les index puisque justement on ne recherche plus une valeur précise mais un ensemble de valeurs. Un range lookup peut se concrétiser par une recherche > ou < càd dès lors qu’on ne recherche pas une valeur stricte.

Range lookup optimization

8.5. Limit

Limit revient à restreindre ce qu’on souhaitait voir (le query) et ne demander qu’une partie : comme pour un site web qu’on affiche sur un téléphone mobile; il est inutile d’envoyer les modules qui seraient cachés sur l’appareil, autant ne pas en générer le contenu dès le début.

Limit revient à faire travailler le serveur MySQL pour rien; autant mieux définir son query dès le départ.

La chapelle

8.6. Explain

Optimisateur de requêtes

https://dev.mysql.com/doc/refman/5.7/en/using-explain.html

explain select * from jos_table order by field desc group by field

Lorsque explain informe qu’il va utiliser des subqueries, il est préférable de convertir ces queries additionnels soit en JOIN soit en queries séparés qui alors pourront être cachés par le cache du serveur de base de données.

8.7. Type

Si la donnée qu’on cherche est une valeur numérique (ID=123456) il faut éviter les quotes (ID='123456') qui vont obliger le serveur à faire du data casting et donc perdre inutilement du temps.

8.8. OR

L’utilisation d’un OR dans un critère peut, probablement, être le signal qu’il serait préférable de faire deux queries séparés qui pourront alors être chacun cachés.

L’utilisation des index pourrait s’en trouver également simplifié et l’exécution du query OR en deux queries qui seraient alors joint sera plus rapide.

SELECT ...
UNION
SELECT ...

8.9. SELECT **

Never ever, ever... Never ever, ever... use star

L’utilisation de * pourrait faire remonter des centaines de mégabytes en mémoire dès lors que la table contient un très grand nombre de colonnes. Ce n’est peut-être pas le cas lors de l’écriture de la requête mais la table pourrait évoluer durant la vie de l’application.

Ne jamais, jamais... Ne jamais, jamais... utiliser l’étoile

9. Obtenir le maximum de votre équipe de développeurs

 Stefan Koopmanschap
 Obtenir le maximum de votre équipe de développeurs

10. Continuous Learning

... en participant p.ex. à des sessions de partage, des conférences, des journées telles des JoomlaDays, ... mais aussi participer à des réunions de groupe (JUGs meetings, ...) pour y rencontrer des pairs, partager trucs et astuces, apprendre nouvelles méthodologies.

Suivre également des formations (classique, elearning, ...) mais aussi en dehors de sa zone de confort, ce qu’on ne fait pas d’habitude pour voir s’il n’y a pas matière à apprendre et de nouvelles habitudes à adopter.

10.1. Small Controller Experiments

Prendre le temps de faire des “petits” tests, une heure p.ex., tester quelque chose de nouveau;

10.2. Pair programming / code reviews

Lorsque cela est possible, travailler en équipe, voir comment son pair s’y prends et, aussi, faire du code review càd lire et analyser le code d’un autre développeur et débattre avec lui pourquoi il a choisi de faire telle activité comme il l’a fait.

10.3. Videos

Il existe un très grand nombre de vidéos sur des sujets techniques sur internet dont p.ex. les videos en streaming des précédents Joomla World Conference voire d’autres :

10.4. Share your knowledge

En écrivant un blog, en partageant ses notes, ... vous prendrez part au partage de connaissances mais vos notes pourront vous resservir plus tard lorsque vous aurez oublié telle ou telle chose.

10.5. Mentoring

Tâchez de trouver un mentor, un coach, quelqu’un qui vous permettra d’atteindre votre prochain jalon.

https://php-mentoring.org

borrel

10.6. Et bien plus encore

11. Échange de données grâce aux services web

 Peter Martin
 http://slides.db8.nl/

Peter Martin

11.1. Webservice

11.2. REST

REpresentational State Transfer

11.3. HATEOAS

Hypertext As The Engine Of Application State

11.4. SLIM Framework

Slim is a PHP micro framework that helps you quickly write simple yet powerful web applications and APIs. Slim peut donc être utilisé en PHP, installable via composer, et permet de bénéficier d’une librairie existante pour être plus rapidement productif.

https://www.slimframework.com/

11.5. CRUD

Les actions sur les données sont définies par la méthode http utilisée :

11.6. XML / JSON

L’output peut être au format XML ou JSON. Privilégier le format JSON qui est moins verbeux car le XML nécessite quantité de tags (ouverture et fermeture)

11.7. Status code

La réponse d’un service web API se caractérise également par le renvoi de codes précis comme p.ex. ladé catégorie 2xx qui signifie que l’appel a été correctement géré et 4xx qu’il y a eu un erreur (403 – access denied, 404 – ressource non trouvée, ...)

11.8. Documentation

http://raml.org/

RESTful API Modeling Language (RAML) makes it easy to manage the whole API lifecycle from design to sharing. It’s concise – you only write what you need to define – and reusable. It is machine readable API design that is actually human friendly

11.9. Linked Data

http://json-ld.org/

Data is messy and disconnected. JSON-LD organizes and connects it, creating a better Web.

11.10. Bonus – Tombola – Gift away

https://kahoot.it/

Kahoot.it

Bedankt

Closing

koeien