Add newsletter #13
This commit is contained in:
Pascal Le Merrer
parent
03e447472f
commit
09a1ba3ee4
3 changed files with 112 additions and 5 deletions
106
content/newsletter/craft-letter-13.md
Normal file
106
content/newsletter/craft-letter-13.md
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
Title: Lettre n°13 — 02 mars 2026
|
||||
Date: 2026-03-02 09:00
|
||||
Category: Newsletter
|
||||
JsonLD: <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BlogPosting", "name": "Lettre n°13", "description": "Lettre de veille technologique en développement logiciel", "image": [ "https://www.craftletter.fr/images/craftletter.svg" ], "datePublished": "Mon Mar 02 2026 09:00:00 GMT+0200 (Coordinated Universal Time)", "author": { "@type": "Person", "name": "Pascal Le Merrer", "url": "https://www.linkedin.com/in/pascal-le-merrer/" } } </script>
|
||||
<img class="logo" alt="Logo Craft Letter" src="{static}/images/craftletter.svg">
|
||||
|
||||
# Lettre # 13
|
||||
|
||||
## Electrobun
|
||||
|
||||
Vous connaissez probablement [Electron](https://www.electronjs.org/)🇬🇧, un framework pour créer des applications Mac, Windows ou Linux à l’aide de technologies Web : HTML, JS et CSS. Il est utilisé par exemple pour le client Slack, mais aussi VSCode. Il combine une version de Chromium avec une instance de NodeJS. Il est régulièrement reproché à Electron la lourdeur des applications générées et leur consommation de ressources.
|
||||
|
||||
Il existe des équivalents basés sur d’autres technologies, qui génèrent des applications moins gourmandes. [Wails](https://wails.io/fr/)🇫🇷 repose sur Go ; comme pour tous les outils de ce type, l’IHM se code en JavaScript avec le framework de votre choix. [Tauri](https://tauri.app/fr/)🇫🇷 est basé sur Rust —mais propose une API qui permet de ne faire que du JavaScript ou TypeScript si vous ne voulez pas écrire de Rust. [Electrobun](https://blackboard.sh/electrobun/docs/)🇬🇧 est une nouvelle alternative, basée sur Zig et Typescript.
|
||||
|
||||
Mon expérience avec Wails s’est avéré meilleure que celle avec Tauri ; j’ai préféré la documentation du premier, et, surtout, la cross-compilation est triviale avec Wails, grâce à l’usage de Go.
|
||||
|
||||
## 10 APIs qui peuvent remplacer des librairies
|
||||
|
||||
Sylwia Laskowska liste [une série d’APIs](https://dev.to/sylwia-lask/stop-installing-libraries-10-browser-apis-that-already-solve-your-problems-35bi) disponibles dans certains navigateurs, et qui peuvent remplacer des bibliothèques.
|
||||
|
||||
Dans le même ordre d’idée, une nouvelle API vient d’arriver dans les principaux navigateurs : [Invoker command](https://www.infoq.com/news/2026/01/html-invoker-commands/), qui permet de contrôler l’ouverture et la fermeture de fenêtres contextuelles (popover, modal…), sans JavaScript.
|
||||
|
||||
## Utiliser des services européens pour monter une startup
|
||||
Robert délivre un [retour d’expérience](https://www.coinerella.com/made-in-eu-it-was-harder-than-i-thought/)🇫🇷 sur sa tentative de se passer des services états-uniens lors de la création d’une startup. Il décrit ce qui a été simple, ce qui l’a été moins, mais aussi ce qui n’a pas été possible.
|
||||
|
||||
Le site [European alternatives](https://european-alternatives.eu/)🇬🇧 référence des services qui pourraient vous servir si vous souhaitez vous lancer dans la même aventure.
|
||||
Attention toutefois, le tarif des services proposés par l’Allemand Hetzner [augmenteront de 30 à 40% au 1ᵉʳ Avril](https://docs.hetzner.com/general/infrastructure-and-availability/price-adjustment/)🇬🇧 😬
|
||||
|
||||
Les fondateurs de startups sont souvent attirés par les offres des GAFAM qui leur sont dédiées. Mais il existe des offres similaires chez les fournisseurs de cloud Français, comme chez [OVH](https://startup.ovhcloud.com/fr/), [Scaleway](https://www.scaleway.com/en/startup-program/), [https://www.selego.co/fr/perks/clevercloud-startup-plan](Clever Cloud) ou [Outscale](https://fr.outscale.com/outscale-for-entrepreneurs/), et sans doute d'autres auquels je n'ai pas pensé.
|
||||
|
||||
_NB : je n'ai aucune affiliation avec ces entreprises._
|
||||
|
||||
## Modern.css
|
||||
|
||||
[Modern.css](https://modern-css.com/)🇬🇧 montre comment des directives CSS disponibles dans les navigateurs récents peuvent remplacer des propriétés CSS anciennes plus verbeuses, voire du JavaScript. L’un des 75 exemples de code concerne des menus déroulants sans JavaScript. Pour chaque astuce, est indiqué le pourcentage d’utilisateurs potentiels dont le navigateur supporte ces nouvelles façons de faire. Les exemples proposés sont filtrables en fonction du support de la technique.
|
||||
|
||||
## CSS sémantique
|
||||
|
||||
Le principe des CSS sémantiques consiste à séparer totalement la présentation de la structure de la page HTML, et à minimiser les classes CSS requises.
|
||||
|
||||
Le site [CSS Zen Garden](https://csszengarden.com/)🇬🇧 est une démonstration impressionnante de ce qu’il est possible de faire en suivant ce principe. L’aspect du site change totalement en fonction du thème sélectionné, alors que le HTML est inchangé.
|
||||
|
||||
Sylvia Moreno explique [comment atteindre cet objectif](https://blog.octo.com/octo-le-css-semantique-ou-l'art-d'ecrire-du-style-qui-a-du-sens-1)🇫🇷, tout en améliorant l’accessibilité. Cela a aussi pour effet de simplifier le code HTML et d’améliorer la maintenabilité.
|
||||
|
||||
|
||||
## Oat : un framework UI sémantique
|
||||
|
||||
Voici un framework UI comme je les aime : simple, léger, qui utilise correctement les possibilités offertes par les CSS (petit tacle à Tailwind au passage, qui pollue le HTML avec de multiples classes CSS).
|
||||
|
||||
[Oat](https://oat.ink/)🇬🇧 pèse seulement 8 Ko, est accessible, et personnalisable à l’aide de variables CSS —aucun outillage n’est nécessaire. Il se base sur le principe des CSS sémantiques. Par exemple, une balise `<button>` sans attribut suffit pour déclarer un bouton dont le style est celui de l’action principale d’un écran ou d’une boîte de dialogue. Il est bien entendu possible de choisir des variantes pour le style des boutons, à l’aide d’attributs HTML ou de classes CSS, mais tout est fait pour réduire les déclarations requises au strict minimum.
|
||||
|
||||
Kailash Nadh, l’auteur de Oat, est aussi celui d’une [série de libraires JS minimales](https://oat.ink/other-libs/)🇬🇧.
|
||||
|
||||
## Animer des sprites en CSS
|
||||
|
||||
Josh Comeau explique comment reproduire, avec des propriétés CSS uniquement, une [animation à base de sprites](https://www.joshwcomeau.com/animation/sprites/)🇬🇧 telle qu’on en fait dans les jeux vidéo 2D.
|
||||
|
||||
## DataStar
|
||||
|
||||
Je vous ai [déjà parlé de Datastar](https://www.craftletter.fr/lettre-ndeg7-19-janvier-2026.html)🇫🇷, une libraire équivalente à HTMX, mais qui n’a pas les limitations de ce dernier concernant les applications complexes. Ces deux frameworks sont des alternatives aux Single Page Applications. Ils minimisent le code JavaScript, et envoient des blocs HTML depuis le serveur pour mettre à jour les pages.
|
||||
|
||||
Le modèle économique de DataStar repose sur une licence payante pour certaines fonctionnalités. Ce point a généré des débats enflammés, et sans intérêt selon moi : la licence est accordée à vie pour un paiement unique, et si on ne souhaite pas la payer il y a des alternatives —à commencer par utiliser un autre framework.
|
||||
|
||||
Ce qui est plus intéressant c’est que [les performances de DataStar sont excellentes](https://biggo.com/news/202510111317_Datastar-Pro-License-Debate)🇬🇧, ce qui n’est pas le cas de certaines technologies plus mainstream comme React.
|
||||
|
||||
## Moderniser un code legacy, partie III
|
||||
|
||||
Dans cette [troisième et dernière partie](https://blog.octo.com/apprivoiser-un-legacy-consequent-sans-y-perdre-les-plumes-partie-iii)🇫🇷, Bruno Boucart explique comment prioriser la refonte des composants identifiés précédemment.
|
||||
|
||||
La priorisation doit tenir compte :
|
||||
* de la valeur métier de chacun des sous-domaines.
|
||||
* de la complexité du code existant, qui peut être mesurée par des outils ;
|
||||
* de la proximité fonctionnelle entre les services migrés (il suggère de migrer d’un coup un ensemble de services qui forment un ensemble cohérent) ;
|
||||
* de l’opportunité d’introduire des fonctionnalités à forte valeur ajoutée.
|
||||
|
||||
Les deux derniers points sont un moyen d’obtenir l’adhésion des utilisateurs à la modernisation du code.
|
||||
|
||||
La valeur métier de chacun des sous-domaines, ainsi que leur complexité, sont utilisés pour les classifier en trois catégories : coeur, support ou générique.
|
||||
|
||||
*Rappel :*
|
||||
* *un sous-domaine **coeur de métier** est ce qui vous distingue de vos concurrents : pour une entreprise de paiement, ça pourrait être le traitement des cartes bancaires ;*
|
||||
* *un sous-domaine **support** est indispensable à votre activité, est spécifique à votre entreprise, mais n’est pas dans votre coeur de métier : toujours pour un service de paiement, ce pourrait être la détection de la fraude ;*
|
||||
* *un sous-domaine **générique** est un service que l’on peut trouver sur étagère, comme l’envoi d’emails.*
|
||||
|
||||
Bruno préconise d’utiliser le Core Domain Chart pour établir cette classification. C’est un diagramme qui peut servir de support pour les discussions entre les experts métier et l’équipe technique.
|
||||
|
||||
Les paramètres pour déterminer l’ordre dans lequel sera réalisée la migration sont multiples, c’est pourquoi il peut être utile d’établir un tableau comparatif. Il listera les critères ci-dessus et servira à tracer les décisions.
|
||||
|
||||
D’autres critères peuvent entrer en jeu, comme les évolutions fonctionnelles prévues, ou des dépendances fortes à d’autres équipes.
|
||||
|
||||
Une fois la priorisation établie, elle peut être mise en oeuvre par vagues successives. Cela limite les risques, et permet aux équipes qui ne passent pas en premier de bénéficier des apprentissages des précédentes.
|
||||
|
||||
Chaque vague comporte une réorganisation des équipes, puis une montée en compétence des équipes techniques, avec l’aide d’un coach, avant la modernisation du code à proprement parler.
|
||||
C’est également le coach qui aidera les développeurs à s’approprier les connaissances métier acquises pendant les ateliers préparatoires (évoqués dans la première partie).
|
||||
|
||||
## SoCraTes Rennes
|
||||
|
||||
Un peu d’auto-promo : si vous n’avez pas encore pris votre place pour [SoCraTes Rennes](https://socrates-rennes.github.io/)🇫🇷, il est temps d’y penser ! Non seulement vous participerez à une journée d’échanges enrichissants avec des pairs, mais ce sera l’occasion de nous rencontrer 😀
|
||||
|
||||
## Lyon Craft
|
||||
|
||||
[Lyon Craft](https://lyon-craft.fr)🇫🇷 sera de retour les 12 et 13 mai prochain, avec un nouveau format, sur deux jours au lieu d’un. La journée de conférences sera en effet suivie d’une non-conférence. La billetterie est ouverte. Vous pouvez proposer des sujets de conférence ou d’atelier en contactant Colin Damon [sur Linkedin](https://www.linkedin.com/in/colin-damon/) ou par e-mail à damon.colin chez Gmail.
|
||||
|
||||
---
|
||||
|
||||
Voilà, c’est tout pour aujourd’hui !
|
||||
|
|
@ -1,17 +1,17 @@
|
|||
Title: Accueil
|
||||
Date: 2026-02-23 09:00
|
||||
Date: 2026-03-02 09:00
|
||||
URL:
|
||||
save_as: index.html
|
||||
Category: Home
|
||||
JsonLD: { "@context": "https://schema.org", "@type": "WebPage", "name": "Accueil", "description": "Lettre de veille technologique en développement logiciel", "image": [ "https://www.craftletter.fr/images/craftletter.svg" ], "datePublished": "Mon Feb 23 2026 09:00:00 GMT+0200 (Coordinated Universal Time)", "author": { "@type": "Person", "name": "Pascal Le Merrer", "url": "https://www.linkedin.com/in/pascal-le-merrer/" } }
|
||||
JsonLD: { "@context": "https://schema.org", "@type": "WebPage", "name": "Accueil", "description": "Lettre de veille technologique en développement logiciel", "image": [ "https://www.craftletter.fr/images/craftletter.svg" ], "datePublished": "Mon Mar 02 2026 09:00:00 GMT+0200 (Coordinated Universal Time)", "author": { "@type": "Person", "name": "Pascal Le Merrer", "url": "https://www.linkedin.com/in/pascal-le-merrer/" } }
|
||||
|
||||
<img class="logo" alt="Logo Craft Letter" src="{static}/images/craftletter.svg">
|
||||
|
||||
|
||||
# La [lettre n°12]({filename}/newsletter/craft-letter-12.md) est parue !
|
||||
# La [lettre n°13]({filename}/newsletter/craft-letter-13.md) est parue !
|
||||
|
||||
La Craft Letter est une newsletter hebdomadaire dans laquelle je partage des articles
|
||||
issues de ma veille technologique. Vous y trouverez des articles relatifs au développement logiciel d'une façon générale, qu'il soit front-end, back-end ou autre. Mais aussi des articles consacrés à l'architecture logicielle, la méthodologie, les outils, des projets open source, des conférences...
|
||||
issus de ma veille technologique. Vous y trouverez des articles relatifs au développement logiciel d'une façon générale, qu'il soit front-end, back-end ou autre. Mais aussi des articles consacrés à l'architecture logicielle, la méthodologie, les outils, des projets open source, des conférences...
|
||||
|
||||
Pour savoir qui je suis, ou pourquoi j'écris cette lettre, je vous invite à vous lire l'édito du [premier numéro]({filename}/newsletter/craft-letter-1.md).
|
||||
|
||||
|
|
@ -37,6 +37,7 @@ Pour savoir qui je suis, ou pourquoi j'écris cette lettre, je vous invite à vo
|
|||
|
||||
# Archives
|
||||
|
||||
* [Lettre n°13]({filename}/newsletter/craft-letter-13.md)
|
||||
* [Lettre n°12]({filename}/newsletter/craft-letter-12.md)
|
||||
* [Lettre n°11]({filename}/newsletter/craft-letter-11.md)
|
||||
* [Lettre n°10]({filename}/newsletter/craft-letter-10.md)
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@
|
|||
<tbody style="font-size: 13px; line-height: 1.5; color: #666666; padding: 0">
|
||||
<tr>
|
||||
<td align="center" style="padding: 20px 40px;">
|
||||
<a href="https://www.craftletter.fr">Craft Letter</a> © 2025 par <a href="https://www.linkedin.com/in/pascal-le-merrer/">Pascal Le Merrer</a><br>est sous licence <a href="https://creativecommons.org/licenses/by-nc-nd/4.0/">CC BY-NC-ND 4.0</a></p><div><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/by.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/nd.svg" style="max-width:1em;max-height:1em;margin-left:.2em">
|
||||
<a href="https://www.craftletter.fr">Craft Letter</a> © 2025 - 2026 par <a href="https://www.linkedin.com/in/pascal-le-merrer/">Pascal Le Merrer</a><br>est sous licence <a href="https://creativecommons.org/licenses/by-nc-nd/4.0/">CC BY-NC-ND 4.0</a></p><div><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/by.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" style="max-width:1em;max-height:1em;margin-left:.2em"><img alt="" src="https://mirrors.creativecommons.org/presskit/icons/nd.svg" style="max-width:1em;max-height:1em;margin-left:.2em">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue