TLDR: J’ai créé un outil en ligne de commande et un plugin Webpack qui convertissent des fichiers HTML en blocs Gutenberg instantanément. Résultat : tu peux créer des blocs personnalisés jusqu’à 5 fois plus vite. 👉 Tu peux le découvrir ici : HTML To Gutenberg J’adore Gutenberg. Et mes clients aussi. Mais comme beaucoup de développeurs WordPress qui ont grandi avec ACF et les bonnes vieilles mét...
Articles
Fastify est un framework web basé sur Node.js, inspiré d’Express, qui offre une excellente expérience de développement grâce à son architecture de plugins. Ayant longtemps travaillé avec Express, j’utilise désormais Fastify exclusivement pour le développement d’API ou d’applications web lorsque JavaScript est la solution la plus adaptée au projet. Dans le cas du développement d’une application ...
import path from 'path';
import FastifyPlugin from 'fastify-plugin';
import FastifyView from '@fastify/view';
import twig from 'twig';
// À modifier selon votre structure de fichiers
con...Pour faciliter la gestion courante d'une boutique E-Commerce, il peut être utile d'afficher directement les prix hors taxe (HT) dans les vues d'administration, notamment pour faciliter les calculs de comptabilité au jour le jour. Par défaut, Drupal Commerce affiche dans ses vues les prix TTC (toutes taxes comprises) et ne propose pas d'option permettant d'afficher le prix HT uniquement. Cet art...
/**
* Plugin implementation of the 'Excluding VAT Price Formatter' formatter.
*
* @FieldFormatter(
* id = "excluding_vat_price_formatter",
* label = @Translation("Excluding VAT Price ...Dès qu'un projet web atteint un certain niveau de complexité, la gestion du déploiement de nouvelles fonctionnalités devient un enjeu crucial. Dans le passé, les développeurs travaillaient parfois pendant des semaines sur des fonctionnalités isolées, avant de fusionner leur travail pour la sortie d'une nouvelle version. Aujourd’hui, les cycles de déploiement sont beaucoup plus rapprochés ; il n...
// Pseudo-code
$user = get_user();
$account_creation_time = $user->getCreatedTime();
$birth_country = $user->get('birth_country');
$birth_date = $user->get('birth_date');
if (
(new DateT...Récemment, j'ai entrepris d'approfondir le "nouvel" éditeur Gutenberg de WordPress pour enfin l'adopter et proposer une meilleure expérience d'édition à mes clients. Ce déclic est arrivé lorsque j'ai vu les vidéos de l'étude de cas de 10up à propos de la réalisation du site de la Maison Blanche. Enfin, j'ai compris que Gutenberg ne se limitait pas simplement à un assemblage de composants atomiq...
add_filter('block_type_metadata_settings', function ($settings, $metadata) {
if (! empty($metadata['render'])) {
$template_path = wp_normalize_path(
realpath(
dirn...
Rediriger un domaine HTTPS vers un autre domaine HTTPS sans serveur web
Publié le
Il y a quelques années, j'avais créé un petit site événementiel qui avait été repris par un important média local. Le domaine ayant expiré depuis mais voyant qu'il était toujours disponible à l'achat, j'ai voulu le récupérer pour créer une redirection vers ce site web et bénéficier d'un backlink de bonne qualité supplémentaire. "Une redirection côté DNS et le tour est joué" pensais-je. Jusque-l...
https://www.monsuperdomaine.com https://www.julienverneaut.com 301!
https://monsuperdomaine.com https://www.julienverneaut.com 301!Lorsque je recherche quelque chose sur internet, je me rends souvent compte que le contenu anglais est souvent bien plus fourni que le contenu français. Même si cela peut paraître évident de part le nombre d'anglophones dans le monde comparé à celui des francophones (de 4 à 5 fois plus nombreux), j'ai voulu démontrer cette hypothèse et surtout la chiffrer. TLDR : En moyenne, un article anglais ...
def getRandomArticlesUrl(locale):
return "https://" + locale + ".wikipedia.org/w/api.php?action=query&generator=random&grnlimit=500&grnnamespace=0&prop=info&format=json"
def getRandomArticl...Lors de la création d'une page de listing, il est souvent nécessaire d'offrir à ses utilisateurs un tri par popularité basé sur le nombre de vues de chacune de ses pages mettant ainsi en avant vos contenus ayant le plus de chances de les intéresser. Pour se faire, Drupal propose le module Statistics fourni dans le cœur (pour le moment) qui permet de stocker anonymement le nombre de vues quotidi...
La gestion de l'état est une des parties les plus importantes du développement d'une application web. De l'utilisation de variables globales aux hooks de React en passant par l'utilisation de librairies tierces comme MobX, Redux ou XState pour ne citer que ces 3 là, c'est un des sujets qui alimente le plus les discussions front tant il est important de le maîtriser pour concevoir une applicatio...
const state = new State({
count: 0,
text: '',
});
state.observe(({ count }) => {
console.log('Count changed', count);
});
state.observe(({ text }) => {
console.log('Text changed...
Supprimer automatiquement les fichiers binlog de MySQL
Publié le
En inspectant les métriques de mon serveur, je me suis rendu compte que mon disque de 50Go était presque rempli alors que ce site n'héberge que très peu de fichiers et contient surtout des données textuelles. J'ai donc utilisé la commande du -h / 2>/dev/null | grep '[0-9\.]\+G' pour trouver les dossiers sur mon serveur qui occupaient le plus d'espace disque. J'ai vu alors que mon dossier /var/l...
[mariadb]
binlog_expire_logs_seconds=21600WordPress étant l'un des CMS les plus populaires au monde, il est une cible privilégiée pour les hackers tant la portée de la découverte d'une nouvelle faille peut être grande. Les attaques automatisées sont légions, ce que n'importe quel webmaster a déjà dû remarquer en explorant les logs des requêtes HTTP reçues par son serveur. Pas de panique cependant, si vous respectez les bonnes pratiques...
/wp-json/wp/v2/users
Astuce Git : Ignorer des fichiers avec un dossier poubelle
Publié le
Si Git permet de conserver la trace de la moindre modification d'un fichier au sein d'un référentiel, il est parfois utile d'avoir dans son projet une zone où pouvoir déposer des fichiers non versionnés, ne serait-ce que pour y laisser des notes, télécharger des dumps, des résultats de curl, etc. Plutôt que de modifier le fichier .gitignore du projet ou de jouer avec le cache de Git pour ne pas...
Par défaut, les condition de visibilité des blocs Drupal sur les Types de contenus permettent de choisir sur quels type de contenus on affiche un bloc, et donc réciproquement ceux sur lesquels ils ne s'affichent pas. Même si ce fonctionnement paraît tout à fait logique à première vue, il ne permet de filtrer que les types de contenus et non les pages générées à partir de routes programmatiques ...
Redirection Netlify basée sur la langue du navigateur
Publié le
Avant de sortir le site web sur lequel vous naviguez actuellement, je maintenais les sous-domaines lab.julienverneaut.com et blog.julienverneaut.com pour publier respectivement des expériences front-end et des articles de blog. J'ai eu la volonté d'unifier ces 2 plateformes en un seul site lors de son redesign afin de permettre à mes visiteurs de découvrir mes autres contenus une fois facilemen...
https://lab.julienverneaut.com https://www.julienverneaut.com/experiences 301!Le module Easy Breadcrumb est un des modules de construction de fil d'Arianne pour Drupal les plus populaires. Lors de son utilisation avec un site multilingue cependant, j'ai constaté que le titre du segment de la page d'accueil (typiquement Accueil en français) n'était pas traduisible dans d'autres langues. Une issue Drupal.org marqué comme Fixed existe à ce sujet mais le fix ne semble pas fo...
diff --git a/src/EasyBreadcrumbBuilder.php b/src/EasyBreadcrumbBuilder.php
index 7790b32..15bedc7 100644
--- a/src/EasyBreadcrumbBuilder.php
+++ b/src/EasyBreadcrumbBuilder.php
@@ -339,7 +339,7...Même si le sélecteur de langue par défaut de Drupal a le mérite d'exister, ses options sont très limitées par défaut et il n'est pas customisable facilement sans utiliser de hooks ou d'overrides de templates compliqués. Un module à été créé pour répondre à cette problématique, le module Language Switcher Extended. Grâce à lui, de nouvelles options font leur apparition via son onglet de configur...
Lors de la migration d'un site WooCommerce vers Shopify, il peut être utile d'importer la liste des clients de l'ancien site pour communiquer avec eux ou pour qu'ils retrouvent leurs informations personnelles comme leur adresse, leur numéro de téléphone, leur mail utilisé pour les communications, etc. S'il est possible d'effectuer un export client côté WooCommerce avec certains plugins à instal...
const mysql = require('mysql2/promise');
const fs = require('fs');
const csv = require('fast-csv');
// TODO: Update these settings with your own config
const dbConfig = {
host: 'localhost'...Pour un référencement naturel efficace, le titre d'une page peut-être un des éléments à optimiser afin de cibler certaines requêtes ou simplement pour donner plus d'informations aux moteurs de recherches quant au contenu présent sur une page. Pour ce site, j'ai créé une taxonomie Technologies dans le but de communiquer avec de potentiels prospects la palette de services que je propose. Ces tech...
<h1>{{ content.field_technology_title }}</h1>Depuis l'intégration d'outils de construction de pipelines aux principaux services d'hébergement de dépôts git (GitHub Actions pour GitHub, GitLab CI/CD pour GitLab), plus aucune excuse n'existe pour continuer le déploiement manuel via FTP. Personnellement plus investi dans l'écosystème de GitHub que celui de GitLab, j'utilise GitHub Actions pour la majorité de mes déploiements avec une pipelin...
name: Build and deploy
on: push
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
Si comme moi vous aimez avoir une console propre et sans erreurs, il se peut que vous ayez déjà été titillé par ce message intempestif remonté sur Google Chrome : [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Traduis en français, ce warning nous signale qu'un listener ajouté à un événement de scroll n'est pas passif, c'est à dire qu'il peut appeler la fon...
// Before any third party import that causes issues
import { passiveSupport } from 'passive-events-support/src/utils';
passiveSupport({
events: 'touchstart', // or any other event tyoes
});