8 months ago · 368dac3a80
--- a/david/2024/03/20/index.html
+++ b/david/2024/03/20/index.html
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
        • <a rel="next"
            href="/david/2024/03/21/"
            title="Publication suivante : Fourchette">Suivant →</a>
    </p>
  </nav>
 <p>J’y ai passé ma soirée mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p><a href="/david/2024/03/19/" title="Excitation">J’y ai passé ma soirée</a> mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p>Il y a encore pas mal de travail —&nbsp;notamment pour rendre la page suffisamment accessible&nbsp;— mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau&nbsp;sécurité.</p>
 <p>Le dépôt est <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component">par ici</a>. Il faut encore que je décide si le formulaire pour le mot de passe devient un <em>web component</em> dédié et/ou un sous-composant, je ne suis pas satisfait du couplage implicite actuel. Itération, itération.</p>
 <p>En bonus, il est possible d’accéder directement au contenu de la page en mettant le mot de passe en ancre de l’URL. J’ai appris au passage que ce fragment d’URL n’était pas transmis dans la requête et ne restait que dans l’historique du&nbsp;navigateur.</p>
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
        • <a rel="next"
            href="/david/2024/03/21/"
            title="Publication suivante : Fourchette">Suivant →</a>
    </p>
  </nav>
--- a/david/2024/03/21/index.html
+++ b/david/2024/03/21/index.html
 <!DOCTYPE html><!-- This is a valid HTML5 document. -->
 <!-- Screen readers, SEO, extensions and so on. -->
 <html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Fourchette
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-03-09.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="Suite des aventures.">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
 <style type="text/css">
  .tippy-content {
    min-width: 280px;
    padding: .5rem;
    font-size: calc(var(--fluid-0) * 0.8);
    font-family: var(--labor-font);
    letter-spacing: initial;
    text-align: left;
  }
  .tippy-content h3 {
    margin-top: 0;
  }
  .tippy-content h3 img {
    max-width: 2rem;
    max-height: 2rem;
    display: inline-block;
  }
  .tippy-content .tippy-links {
    display: flex;
    justify-content: space-around;
  }
  .tippy-content a {
    padding: .4rem;
    color: #F06048;
  }
 </style>
  <body data-instant-intensity="viewport-all">
    <article>
  <header>
    <hgroup>
      <h1>Fourchette</h1>
      <p>Le <time datetime="2024-03-21">21 mars 2024</time></p>
    </hgroup>
  </header>
  <nav>
    <p>
        <a rel="prev"
           href="/david/2024/03/20/"
           title="Publication précédente : PageCrypt">← Précédent</a> •
      <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
      •
      <a href="/david/recherche/"
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
    </p>
  </nav>
 <p><em><a href="/david/2024/03/19/" title="Excitation">Suite</a> des <a href="/david/2024/03/20/" title="PageCrypt">aventures</a>.</em></p>
 <p>Un peu <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component">plus de documentation</a> (<a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">la démo</a> servant aussi d’introduction). Une <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE">licence AGPLv3</a> qui soit <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme">compatible avec l’implémentation principale</a> dont je m’inspire. Je ne sais pas trop si c’est un <em>fork</em> au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une&nbsp;convergence.</p>
 <p>J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le <em>Web Component</em>. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog">un élément <code>&lt;dialog&gt;</code></a> pour le formulaire mais j’ai préféré rester&nbsp;basique.</p>
 <p>Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts&nbsp;actuels.</p>
 <a href="#hr-128" title="Lien vers cette section de la page"><hr id="hr-128" /></a>
 <p><a data-link-domain="redis.io" href="https://redis.io/">Redis</a> a maintenant un <em>fork</em>&nbsp;: <a data-link-domain="codeberg.org" href="https://codeberg.org/redict/redict">redict</a> suite à un <a data-link-domain="github.com" href="https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125">changement de licence</a> qui n’est plus tout à fait open-source, du moins tel que défini par <a data-link-domain="opensource.org" href="https://opensource.org/">l’OSI</a>.</p>
 <a href="#hr-129" title="Lien vers cette section de la page"><hr id="hr-129" /></a>
 <p>En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car <a href="/david/2024/01/09/" title="Blessure">j’ai quand même été immobilisé</a> un moment), je me rends compte que ça prend un temps non&nbsp;négligeable.</p>
 <p>Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un&nbsp;mois.</p>
 <p>J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était&nbsp;piquante&#8239;!</p>
    <nav>
      <p>
          <a href="/david/2024/communaute/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#communauté</a>
          <a href="/david/2024/opensource/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#opensource</a>
          <a href="/david/2024/technique/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#technique</a>
        <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
      </p>
    </nav>
  <nav>
    <p>
        <a rel="prev"
           href="/david/2024/03/20/"
           title="Publication précédente : PageCrypt">← Précédent</a> •
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
    </p>
  </nav>
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }
        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })
          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }
      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }
          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }
        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
  <script src="/static/david/js/popper-2.11.8.min.js"></script>
  <script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script>
  <script>
    tippy('[data-tippy]', {
      content(reference) {
        reference.addEventListener('click', (e) => e.preventDefault())
        return `
        <h3 lang="fr">
          <img src="${reference.dataset.favicon}" loading="lazy">
          <a href="${reference.dataset.source}"
            >Article sur ${reference.dataset.domain}</a></h3>
        <p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p>
        <div class="tippy-links" lang="fr">
          <a href="${reference.href}">Archive au ${reference.dataset.date}</a>
        </div>
        `
      },
      allowHTML: true,
      interactive: true,
      delay: [150, 700],
      hideOnClick: false
    })
  </script>
  <script type="module">
    import { annotate } from '/static/david/js/rough-notation-0.5.1.esm.min.js'
    const markObserver = new IntersectionObserver((entries, observer) => {
      const computedStyle = getComputedStyle(document.documentElement)
      const markBackground = computedStyle.getPropertyValue('--mark-background')
      for (const entry of entries) {
        if (entry.intersectionRatio === 0) continue
        const markElement = entry.target
        markElement.style.backgroundColor = 'inherit'
        const annotation = annotate(
          markElement, {
            type: 'highlight',
            multiline: true,
            color: markBackground,
            // animate: !window.matchMedia('(prefers-reduced-motion: reduce)').matches
            animate: false
          }
        )
        annotation.show()
        observer.unobserve(markElement)
      }
    }, {threshold: 1.0})
    for (const markElement of document.querySelectorAll('mark')) {
      markObserver.observe(markElement)
    }
  </script>
  </body>
 </html>
--- a/david/2024/_sources/2024-03-20
+++ b/david/2024/_sources/2024-03-20
 # PageCrypt
 J’y ai passé ma soirée mais j’ai un [truc qui fonctionne pour une démo](https://davidbgk.gitlab.io/page-crypt-web-component/). Ça ressemble beaucoup à un *patchwork* de bouts de code récupérés [ici](https://www.maxlaumeister.com/pagecrypt/) et [là](https://github.com/Greenheart/pagecrypt) puis [aussi là](https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py) pour la partie Python.
 [J’y ai passé ma soirée](/david/2024/03/19/) mais j’ai un [truc qui fonctionne pour une démo](https://davidbgk.gitlab.io/page-crypt-web-component/). Ça ressemble beaucoup à un *patchwork* de bouts de code récupérés [ici](https://www.maxlaumeister.com/pagecrypt/) et [là](https://github.com/Greenheart/pagecrypt) puis [aussi là](https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py) pour la partie Python.
 Il y a encore pas mal de travail — notamment pour rendre la page suffisamment accessible — mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau sécurité.
--- a/david/2024/_sources/2024-03-21
+++ b/david/2024/_sources/2024-03-21
 # Fourchette
 *[Suite](/david/2024/03/19/) des [aventures](/david/2024/03/20/).*
 Un peu [plus de documentation](https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component) ([la démo](https://davidbgk.gitlab.io/page-crypt-web-component/) servant aussi d’introduction). Une [licence AGPLv3](https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE) qui soit [compatible avec l’implémentation principale](https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme) dont je m’inspire. Je ne sais pas trop si c’est un *fork* au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une convergence.
 J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le *Web Component*. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser [un élément `<dialog>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog) pour le formulaire mais j’ai préféré rester basique.
 Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts actuels.
 ---
 [Redis](https://redis.io/) a maintenant un *fork* : [redict](https://codeberg.org/redict/redict) suite à un [changement de licence](https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125) qui n’est plus tout à fait open-source, du moins tel que défini par [l’OSI](https://opensource.org/).
 ---
 En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car [j’ai quand même été immobilisé](/david/2024/01/09/) un moment), je me rends compte que ça prend un temps non négligeable.
 Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un mois.
 J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était piquante !
 #communauté #opensource #technique
--- a/david/2024/communaute/index.html
+++ b/david/2024/communaute/index.html
    </p>
  </nav>
    <h2>
      <a href="/david/2024/03/21/" title="Lien permanent vers cet article">Fourchette</a> <time datetime="2024-03-21">21 mars 2024</time>
    </h2>
 <p><em><a href="/david/2024/03/19/" title="Excitation">Suite</a> des <a href="/david/2024/03/20/" title="PageCrypt">aventures</a>.</em></p>
 <p>Un peu <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component">plus de documentation</a> (<a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">la démo</a> servant aussi d’introduction). Une <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE">licence AGPLv3</a> qui soit <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme">compatible avec l’implémentation principale</a> dont je m’inspire. Je ne sais pas trop si c’est un <em>fork</em> au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une&nbsp;convergence.</p>
 <p>J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le <em>Web Component</em>. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog">un élément <code>&lt;dialog&gt;</code></a> pour le formulaire mais j’ai préféré rester&nbsp;basique.</p>
 <p>Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts&nbsp;actuels.</p>
 <a href="#hr-128" title="Lien vers cette section de la page"><hr id="hr-128" /></a>
 <p><a data-link-domain="redis.io" href="https://redis.io/">Redis</a> a maintenant un <em>fork</em>&nbsp;: <a data-link-domain="codeberg.org" href="https://codeberg.org/redict/redict">redict</a> suite à un <a data-link-domain="github.com" href="https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125">changement de licence</a> qui n’est plus tout à fait open-source, du moins tel que défini par <a data-link-domain="opensource.org" href="https://opensource.org/">l’OSI</a>.</p>
 <a href="#hr-129" title="Lien vers cette section de la page"><hr id="hr-129" /></a>
 <p>En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car <a href="/david/2024/01/09/" title="Blessure">j’ai quand même été immobilisé</a> un moment), je me rends compte que ça prend un temps non&nbsp;négligeable.</p>
 <p>Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un&nbsp;mois.</p>
 <p>J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était&nbsp;piquante&#8239;!</p>
      <nav>
        <p>
            <a href="/david/2024/communaute/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#communauté</a>
            <a href="/david/2024/opensource/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#opensource</a>
            <a href="/david/2024/technique/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#technique</a>
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    <h2>
      <a href="/david/2024/02/11/" title="Lien permanent vers cet article">Violence</a> <time datetime="2024-02-11">11 février 2024</time>
    </h2>
--- a/david/2024/index.html
+++ b/david/2024/index.html
      <a href="/david/2024/03/16/">Descriptions</a>, 
      <a href="/david/2024/03/18/">Casquettes</a>, 
      <a href="/david/2024/03/19/">Excitation</a>, 
      <a href="/david/2024/03/20/">PageCrypt</a>.
      <a href="/david/2024/03/20/">PageCrypt</a>, 
      <a href="/david/2024/03/21/">Fourchette</a>.
    </p>
      <a href="/david/2024/aventure/" rel="tag">#aventure (4)</a>, 
      <a href="/david/2024/cinema/" rel="tag">#cinéma (1)</a>, 
      <a href="/david/2024/commun/" rel="tag">#commun (9)</a>, 
      <a href="/david/2024/communaute/" rel="tag">#communauté (5)</a>, 
      <a href="/david/2024/communaute/" rel="tag">#communauté (6)</a>, 
      <a href="/david/2024/decentralisation/" rel="tag">#décentralisation (1)</a>, 
      <a href="/david/2024/deception/" rel="tag">#déception (3)</a>, 
      <a href="/david/2024/decision/" rel="tag">#décision (8)</a>, 
      <a href="/david/2024/lecture/" rel="tag">#lecture (4)</a>, 
      <a href="/david/2024/liens/" rel="tag">#liens (1)</a>, 
      <a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>, 
      <a href="/david/2024/opensource/" rel="tag">#opensource (8)</a>, 
      <a href="/david/2024/opensource/" rel="tag">#opensource (9)</a>, 
      <a href="/david/2024/parentalite/" rel="tag">#parentalité (5)</a>, 
      <a href="/david/2024/partage/" rel="tag">#partage (6)</a>, 
      <a href="/david/2024/parvenir/" rel="tag">#parvenir (3)</a>, 
      <a href="/david/2024/psychologie/" rel="tag">#psychologie (10)</a>, 
      <a href="/david/2024/solastalgia/" rel="tag">#solastalgia (5)</a>, 
      <a href="/david/2024/sport/" rel="tag">#sport (6)</a>, 
      <a href="/david/2024/technique/" rel="tag">#technique (17)</a>, 
      <a href="/david/2024/technique/" rel="tag">#technique (18)</a>, 
      <a href="/david/2024/velo/" rel="tag">#vélo (1)</a>, 
      <a href="/david/2024/web/" rel="tag">#web (13)</a>.
--- a/david/2024/laboratoire/index.html
+++ b/david/2024/laboratoire/index.html
      <a href="/david/2024/03/20/" title="Lien permanent vers cet article">PageCrypt</a> <time datetime="2024-03-20">20 mars 2024</time>
    </h2>
 <p>J’y ai passé ma soirée mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p><a href="/david/2024/03/19/" title="Excitation">J’y ai passé ma soirée</a> mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p>Il y a encore pas mal de travail —&nbsp;notamment pour rendre la page suffisamment accessible&nbsp;— mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau&nbsp;sécurité.</p>
 <p>Le dépôt est <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component">par ici</a>. Il faut encore que je décide si le formulaire pour le mot de passe devient un <em>web component</em> dédié et/ou un sous-composant, je ne suis pas satisfait du couplage implicite actuel. Itération, itération.</p>
 <p>En bonus, il est possible d’accéder directement au contenu de la page en mettant le mot de passe en ancre de l’URL. J’ai appris au passage que ce fragment d’URL n’était pas transmis dans la requête et ne restait que dans l’historique du&nbsp;navigateur.</p>
--- a/david/2024/opensource/index.html
+++ b/david/2024/opensource/index.html
    </p>
  </nav>
    <h2>
      <a href="/david/2024/03/21/" title="Lien permanent vers cet article">Fourchette</a> <time datetime="2024-03-21">21 mars 2024</time>
    </h2>
 <p><em><a href="/david/2024/03/19/" title="Excitation">Suite</a> des <a href="/david/2024/03/20/" title="PageCrypt">aventures</a>.</em></p>
 <p>Un peu <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component">plus de documentation</a> (<a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">la démo</a> servant aussi d’introduction). Une <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE">licence AGPLv3</a> qui soit <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme">compatible avec l’implémentation principale</a> dont je m’inspire. Je ne sais pas trop si c’est un <em>fork</em> au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une&nbsp;convergence.</p>
 <p>J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le <em>Web Component</em>. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog">un élément <code>&lt;dialog&gt;</code></a> pour le formulaire mais j’ai préféré rester&nbsp;basique.</p>
 <p>Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts&nbsp;actuels.</p>
 <a href="#hr-128" title="Lien vers cette section de la page"><hr id="hr-128" /></a>
 <p><a data-link-domain="redis.io" href="https://redis.io/">Redis</a> a maintenant un <em>fork</em>&nbsp;: <a data-link-domain="codeberg.org" href="https://codeberg.org/redict/redict">redict</a> suite à un <a data-link-domain="github.com" href="https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125">changement de licence</a> qui n’est plus tout à fait open-source, du moins tel que défini par <a data-link-domain="opensource.org" href="https://opensource.org/">l’OSI</a>.</p>
 <a href="#hr-129" title="Lien vers cette section de la page"><hr id="hr-129" /></a>
 <p>En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car <a href="/david/2024/01/09/" title="Blessure">j’ai quand même été immobilisé</a> un moment), je me rends compte que ça prend un temps non&nbsp;négligeable.</p>
 <p>Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un&nbsp;mois.</p>
 <p>J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était&nbsp;piquante&#8239;!</p>
      <nav>
        <p>
            <a href="/david/2024/communaute/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#communauté</a>
            <a href="/david/2024/opensource/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#opensource</a>
            <a href="/david/2024/technique/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#technique</a>
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    <h2>
      <a href="/david/2024/03/20/" title="Lien permanent vers cet article">PageCrypt</a> <time datetime="2024-03-20">20 mars 2024</time>
    </h2>
 <p>J’y ai passé ma soirée mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p><a href="/david/2024/03/19/" title="Excitation">J’y ai passé ma soirée</a> mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p>Il y a encore pas mal de travail —&nbsp;notamment pour rendre la page suffisamment accessible&nbsp;— mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau&nbsp;sécurité.</p>
 <p>Le dépôt est <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component">par ici</a>. Il faut encore que je décide si le formulaire pour le mot de passe devient un <em>web component</em> dédié et/ou un sous-composant, je ne suis pas satisfait du couplage implicite actuel. Itération, itération.</p>
 <p>En bonus, il est possible d’accéder directement au contenu de la page en mettant le mot de passe en ancre de l’URL. J’ai appris au passage que ce fragment d’URL n’était pas transmis dans la requête et ne restait que dans l’historique du&nbsp;navigateur.</p>
--- a/david/2024/technique/index.html
+++ b/david/2024/technique/index.html
    </p>
  </nav>
    <h2>
      <a href="/david/2024/03/21/" title="Lien permanent vers cet article">Fourchette</a> <time datetime="2024-03-21">21 mars 2024</time>
    </h2>
 <p><em><a href="/david/2024/03/19/" title="Excitation">Suite</a> des <a href="/david/2024/03/20/" title="PageCrypt">aventures</a>.</em></p>
 <p>Un peu <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component">plus de documentation</a> (<a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">la démo</a> servant aussi d’introduction). Une <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE">licence AGPLv3</a> qui soit <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme">compatible avec l’implémentation principale</a> dont je m’inspire. Je ne sais pas trop si c’est un <em>fork</em> au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une&nbsp;convergence.</p>
 <p>J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le <em>Web Component</em>. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser <a data-link-domain="MDN" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog">un élément <code>&lt;dialog&gt;</code></a> pour le formulaire mais j’ai préféré rester&nbsp;basique.</p>
 <p>Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts&nbsp;actuels.</p>
 <a href="#hr-128" title="Lien vers cette section de la page"><hr id="hr-128" /></a>
 <p><a data-link-domain="redis.io" href="https://redis.io/">Redis</a> a maintenant un <em>fork</em>&nbsp;: <a data-link-domain="codeberg.org" href="https://codeberg.org/redict/redict">redict</a> suite à un <a data-link-domain="github.com" href="https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125">changement de licence</a> qui n’est plus tout à fait open-source, du moins tel que défini par <a data-link-domain="opensource.org" href="https://opensource.org/">l’OSI</a>.</p>
 <a href="#hr-129" title="Lien vers cette section de la page"><hr id="hr-129" /></a>
 <p>En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car <a href="/david/2024/01/09/" title="Blessure">j’ai quand même été immobilisé</a> un moment), je me rends compte que ça prend un temps non&nbsp;négligeable.</p>
 <p>Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un&nbsp;mois.</p>
 <p>J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était&nbsp;piquante&#8239;!</p>
      <nav>
        <p>
            <a href="/david/2024/communaute/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#communauté</a>
            <a href="/david/2024/opensource/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#opensource</a>
            <a href="/david/2024/technique/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#technique</a>
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    <h2>
      <a href="/david/2024/03/20/" title="Lien permanent vers cet article">PageCrypt</a> <time datetime="2024-03-20">20 mars 2024</time>
    </h2>
 <p>J’y ai passé ma soirée mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p><a href="/david/2024/03/19/" title="Excitation">J’y ai passé ma soirée</a> mais j’ai un <a data-link-domain="davidbgk.gitlab.io" href="https://davidbgk.gitlab.io/page-crypt-web-component/">truc qui fonctionne pour une démo</a>. Ça ressemble beaucoup à un <em>patchwork</em> de bouts de code récupérés <a data-link-domain="maxlaumeister.com" href="https://www.maxlaumeister.com/pagecrypt/">ici</a> et <a data-link-domain="github.com" href="https://github.com/Greenheart/pagecrypt">là</a> puis <a data-link-domain="github.com" href="https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py">aussi là</a> pour la partie&nbsp;Python.</p>
 <p>Il y a encore pas mal de travail —&nbsp;notamment pour rendre la page suffisamment accessible&nbsp;— mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau&nbsp;sécurité.</p>
 <p>Le dépôt est <a data-link-domain="gitlab.com" href="https://gitlab.com/davidbgk/page-crypt-web-component">par ici</a>. Il faut encore que je décide si le formulaire pour le mot de passe devient un <em>web component</em> dédié et/ou un sous-composant, je ne suis pas satisfait du couplage implicite actuel. Itération, itération.</p>
 <p>En bonus, il est possible d’accéder directement au contenu de la page en mettant le mot de passe en ancre de l’URL. J’ai appris au passage que ce fragment d’URL n’était pas transmis dans la requête et ne restait que dans l’historique du&nbsp;navigateur.</p>
--- a/david/index.html
+++ b/david/index.html
  </style>
  <p>Liste des publications récentes en ordre anté-chronologique :</p>
  <p>
    <a href="/david/2024/03/21/" data-communaute data-opensource data-technique  title="Étiquettes : communauté, opensource, technique.">Fourchette</a>,
    <a href="/david/2024/03/20/" data-laboratoire data-opensource data-technique  title="Étiquettes : laboratoire, opensource, technique.">PageCrypt</a>,
    <a href="/david/2024/03/19/" data-apprentissage data-enthousiasme data-technique  title="Étiquettes : apprentissage, enthousiasme, technique.">Excitation</a>,
    <a href="/david/2024/03/18/" data-adaptation data-addiction data-evolution  title="Étiquettes : adaptation, addiction, évolution.">Casquettes</a>,
    <a href="/david/2024/aventure/" data-tag="aventure" rel="tag">#aventure (4)</a>,
    <a href="/david/2024/cinema/" data-tag="cinema" rel="tag">#cinéma (1)</a>,
    <a href="/david/2024/commun/" data-tag="commun" rel="tag">#commun (9)</a>,
    <a href="/david/2024/communaute/" data-tag="communaute" rel="tag">#communauté (5)</a>,
    <a href="/david/2024/communaute/" data-tag="communaute" rel="tag">#communauté (6)</a>,
    <a href="/david/2024/decentralisation/" data-tag="decentralisation" rel="tag">#décentralisation (1)</a>,
    <a href="/david/2024/deception/" data-tag="deception" rel="tag">#déception (3)</a>,
    <a href="/david/2024/decision/" data-tag="decision" rel="tag">#décision (8)</a>,
    <a href="/david/2024/lecture/" data-tag="lecture" rel="tag">#lecture (4)</a>,
    <a href="/david/2024/liens/" data-tag="liens" rel="tag">#liens (1)</a>,
    <a href="/david/2024/opendata/" data-tag="opendata" rel="tag">#opendata (1)</a>,
    <a href="/david/2024/opensource/" data-tag="opensource" rel="tag">#opensource (8)</a>,
    <a href="/david/2024/opensource/" data-tag="opensource" rel="tag">#opensource (9)</a>,
    <a href="/david/2024/parentalite/" data-tag="parentalite" rel="tag">#parentalité (5)</a>,
    <a href="/david/2024/partage/" data-tag="partage" rel="tag">#partage (6)</a>,
    <a href="/david/2024/parvenir/" data-tag="parvenir" rel="tag">#parvenir (3)</a>,
    <a href="/david/2024/psychologie/" data-tag="psychologie" rel="tag">#psychologie (10)</a>,
    <a href="/david/2024/solastalgia/" data-tag="solastalgia" rel="tag">#solastalgia (5)</a>,
    <a href="/david/2024/sport/" data-tag="sport" rel="tag">#sport (6)</a>,
    <a href="/david/2024/technique/" data-tag="technique" rel="tag">#technique (17)</a>,
    <a href="/david/2024/technique/" data-tag="technique" rel="tag">#technique (18)</a>,
    <a href="/david/2024/velo/" data-tag="velo" rel="tag">#vélo (1)</a>,
    <a href="/david/2024/web/" data-tag="web" rel="tag">#web (13)</a>.
--- a/david/log/index.xml
+++ b/david/log/index.xml
    <link href="https://larlet.fr/david/" rel="alternate" type="text/html" />
    <link href="https://larlet.fr/david/log/" rel="self" />
    <id>https://larlet.fr/david/</id>
    <updated>2024-03-21T12:00:00+01:00</updated>
    <updated>2024-03-22T12:00:00+01:00</updated>
    <author>
        <name>David Larlet</name>
        <uri>https://larlet.fr/david/</uri>
    </author>
    <rights>Copyright (c) 2004-2024, David Larlet</rights>
        <entry xml:lang="fr">
            <title type="html">Fourchette</title>
            <link href="https://larlet.fr/david/2024/03/21/" rel="alternate" type="text/html" />
            <updated>2024-03-21T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/03/21/</id>
            <summary type="html">
 &lt;p&gt;&lt;em&gt;&lt;a href=&quot;https://larlet.fr/david/2024/03/19/&quot;&gt;Suite&lt;/a&gt; des &lt;a href=&quot;https://larlet.fr/david/2024/03/20/&quot;&gt;aventures&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;
 &lt;p&gt;Un peu &lt;a href=&quot;https://gitlab.com/davidbgk/page-crypt-web-component#pagecrypt-web-component&quot;&gt;plus de documentation&lt;/a&gt; (&lt;a href=&quot;https://davidbgk.gitlab.io/page-crypt-web-component/&quot;&gt;la démo&lt;/a&gt; servant aussi d’introduction). Une &lt;a href=&quot;https://gitlab.com/davidbgk/page-crypt-web-component/-/blob/main/LICENSE&quot;&gt;licence AGPLv3&lt;/a&gt; qui soit &lt;a href=&quot;https://github.com/Greenheart/pagecrypt?tab=AGPL-3.0-1-ov-file#readme&quot;&gt;compatible avec l’implémentation principale&lt;/a&gt; dont je m’inspire. Je ne sais pas trop si c’est un &lt;em&gt;fork&lt;/em&gt; au final, c’est assez hybride comme nouvelle branche, j’ai plus l’impression d’une&amp;nbsp;convergence.&lt;/p&gt;
 &lt;p&gt;J’ai surtout travaillé sur l’intégration du formulaire de saisie du mot de passe qui se situe maintenant dans le &lt;em&gt;Web Component&lt;/em&gt;. Je voulais privilégier la simplicité d’usage, ce qui implique de prendre quelques raccourcis. J’ai beaucoup hésité à utiliser &lt;a href=&quot;https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog&quot;&gt;un élément &lt;code&gt;&amp;lt;dialog&amp;gt;&lt;/code&gt;&lt;/a&gt; pour le formulaire mais j’ai préféré rester&amp;nbsp;basique.&lt;/p&gt;
 &lt;p&gt;Il y a encore du travail mais la base me semble utilisable. C’est en essayant de l’intégrer par ailleurs que je vais me rendre compte de tous les défauts&amp;nbsp;actuels.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;p&gt;&lt;a href=&quot;https://redis.io/&quot;&gt;Redis&lt;/a&gt; a maintenant un &lt;em&gt;fork&lt;/em&gt;&amp;nbsp;: &lt;a href=&quot;https://codeberg.org/redict/redict&quot;&gt;redict&lt;/a&gt; suite à un &lt;a href=&quot;https://github.com/redis/redis-doc/commit/69921f506c02f65606498cfb4c083c6d8f91f125&quot;&gt;changement de licence&lt;/a&gt; qui n’est plus tout à fait open-source, du moins tel que défini par &lt;a href=&quot;https://opensource.org/&quot;&gt;l’OSI&lt;/a&gt;.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;p&gt;En ayant repris un entraînement physique assez intensif pour récupérer une forme acceptable (car &lt;a href=&quot;https://larlet.fr/david/2024/01/09/&quot;&gt;j’ai quand même été immobilisé&lt;/a&gt; un moment), je me rends compte que ça prend un temps non&amp;nbsp;négligeable.&lt;/p&gt;
 &lt;p&gt;Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si ça permet de gagner du temps dans la préparation des pieds, retours dans un&amp;nbsp;mois.&lt;/p&gt;
 &lt;p&gt;J’ai aussi réduit mon coup de fourchette car le printemps s’en vient et je vais moins avoir besoin de me protéger du froid. Même si cette sortie course du jour par -15°C en ressenti était&amp;nbsp;piquante&amp;#8239;!&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/communaute/&quot;&gt;#communauté&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/opensource/&quot;&gt;#opensource&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
        <entry xml:lang="fr">
            <title type="html">PageCrypt</title>
            <link href="https://larlet.fr/david/2024/03/20/" rel="alternate" type="text/html" />
            <updated>2024-03-20T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/03/20/</id>
            <summary type="html">
 &lt;p&gt;J’y ai passé ma soirée mais j’ai un &lt;a href=&quot;https://davidbgk.gitlab.io/page-crypt-web-component/&quot;&gt;truc qui fonctionne pour une démo&lt;/a&gt;. Ça ressemble beaucoup à un &lt;em&gt;patchwork&lt;/em&gt; de bouts de code récupérés &lt;a href=&quot;https://www.maxlaumeister.com/pagecrypt/&quot;&gt;ici&lt;/a&gt; et &lt;a href=&quot;https://github.com/Greenheart/pagecrypt&quot;&gt;là&lt;/a&gt; puis &lt;a href=&quot;https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py&quot;&gt;aussi là&lt;/a&gt; pour la partie&amp;nbsp;Python.&lt;/p&gt;
 &lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/03/19/&quot;&gt;J’y ai passé ma soirée&lt;/a&gt; mais j’ai un &lt;a href=&quot;https://davidbgk.gitlab.io/page-crypt-web-component/&quot;&gt;truc qui fonctionne pour une démo&lt;/a&gt;. Ça ressemble beaucoup à un &lt;em&gt;patchwork&lt;/em&gt; de bouts de code récupérés &lt;a href=&quot;https://www.maxlaumeister.com/pagecrypt/&quot;&gt;ici&lt;/a&gt; et &lt;a href=&quot;https://github.com/Greenheart/pagecrypt&quot;&gt;là&lt;/a&gt; puis &lt;a href=&quot;https://github.com/MaxLaumeister/PageCrypt/blob/master/python/encrypt.py&quot;&gt;aussi là&lt;/a&gt; pour la partie&amp;nbsp;Python.&lt;/p&gt;
 &lt;p&gt;Il y a encore pas mal de travail —&amp;nbsp;notamment pour rendre la page suffisamment accessible&amp;nbsp;— mais au moins la partie crypto / boîte noire semble fonctionner à la fois du côté génération en Python et consommation en JS. C’est la partie qui me faisait un peu peur et sur laquelle j’ai un peu patiné car c’est bien au-delà de mes compétences et que je ne veux pas prendre l’initiative de trop adapter sans comprendre les enjeux niveau&amp;nbsp;sécurité.&lt;/p&gt;
 &lt;p&gt;Le dépôt est &lt;a href=&quot;https://gitlab.com/davidbgk/page-crypt-web-component&quot;&gt;par ici&lt;/a&gt;. Il faut encore que je décide si le formulaire pour le mot de passe devient un &lt;em&gt;web component&lt;/em&gt; dédié et/ou un sous-composant, je ne suis pas satisfait du couplage implicite actuel. Itération, itération.&lt;/p&gt;
 &lt;p&gt;En bonus, il est possible d’accéder directement au contenu de la page en mettant le mot de passe en ancre de l’URL. J’ai appris au passage que ce fragment d’URL n’était pas transmis dans la requête et ne restait que dans l’historique du&amp;nbsp;navigateur.&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/apprentissage/&quot;&gt;#apprentissage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/laboratoire/&quot;&gt;#laboratoire&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/web/&quot;&gt;#web&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
        <entry xml:lang="fr">
            <title type="html">In·directions</title>
            <link href="https://larlet.fr/david/2024/02/18/" rel="alternate" type="text/html" />
            <updated>2024-02-18T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/02/18/</id>
            <summary type="html">
 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;Any time you have a design that references the same value across multiple pieces of UI, I’d suggest that is an opportunity for &lt;mark&gt;abstracting&lt;/mark&gt; that value into a name that better describes the intention of the value in the&amp;nbsp;design.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://jwdallas.com/posts/namingcssvariables/&quot;&gt;Naming Variables In&amp;nbsp;CSS&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Je me demande souvent quel est le bon niveau hiérarchique au sein des CSS modernes. L’approche constatée actuelle semble être de mettre des variables par couleur (par exemple) puis ensuite définir des variables intermédiaires pour leur donner un sens pour un contexte&amp;nbsp;donné.&lt;/p&gt;
 &lt;pre&gt;&lt;code&gt;:root {
  --umap-color-darkBlue: #263B58;
 }
 button {
  --color-primary: var(--umap-color-darkBlue);
 }
 button.primary {
  background-color: var(--color-primary);
 }
 &lt;/code&gt;&lt;/pre&gt;
 &lt;p&gt;Il s’agit ici de partir d’un exemple simpliste mais concret. J’imagine qu’il y a autant de dévelopeur·euse que de façon d’écrire ces 3&amp;nbsp;seules déclarations&amp;nbsp;:). Pourquoi &lt;code&gt;:root&lt;/code&gt; et pas &lt;code&gt;html&lt;/code&gt;&amp;#8239;? Est-ce qu’il faut définir les couleurs primaires sur le &lt;code&gt;button&lt;/code&gt; ou sur &lt;code&gt;form, nav&lt;/code&gt;&amp;#8239;? Ou faire sauter cet intermédiaire&amp;#8239;? Est-ce qu’il faut &lt;code&gt;button.primary&lt;/code&gt;, &lt;code&gt;.primary&lt;/code&gt;, &lt;code&gt;.button-primary&lt;/code&gt;, &lt;code&gt;.button.button-primary&lt;/code&gt;&amp;#8239;? Etc, etc.&lt;/p&gt;
 &lt;p&gt;Et je ne mentionne même pas les solutions à partir de &lt;code&gt;:host&lt;/code&gt; / &lt;code&gt;:host-context()&lt;/code&gt; ou &lt;code&gt;:scope&lt;/code&gt; qui sont encore d’autres façons de faire qui sont peut-être amenées à devenir&amp;nbsp;populaires.&lt;/p&gt;
 &lt;p&gt;Venant d’un langage dont l’&lt;a href=&quot;https://en.wikipedia.org/wiki/Zen_of_Python&quot;&gt;un des mantras&lt;/a&gt; est &lt;q lang=&quot;en&quot;&gt;There should be one-- and preferably only one --obvious way to do it.&lt;/q&gt;, il est plus difficile de se retrouver devant une telle… flexibilité&amp;#8239;? Lorsqu’on envisage un commun sur ces 10&amp;nbsp;prochaines années, comment trouver une stratégie maintenable qui s’inscrira dans la durée avec&amp;nbsp;enthousiasme&amp;#8239;?&lt;/p&gt;
 &lt;p&gt;Ce qui est certain, c’est que l’approche de Tailwind ne me convient pas du&amp;nbsp;tout.&lt;/p&gt;
 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;To keep up with the ever-evolving CSS standard Tailwind introduced another set of language literals. Over the years Tailwind has grown from a simple set of atoms to a &lt;mark&gt;vendor-specific&lt;/mark&gt; language with expressions, operators, and method&amp;nbsp;calls.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://nuejs.org/blog/tailwind-misinformation-engine/&quot;&gt;Tailwind marketing and misinformation&amp;nbsp;engine&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;hr /&gt;
 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;&lt;em&gt;File over app&lt;/em&gt; is a philosophy: if you want to create digital artifacts that last, they must be files you can control, in formats that are easy to retrieve and read. &lt;mark&gt;Use tools that give you this&amp;nbsp;freedom.&lt;/mark&gt;&lt;/p&gt;
 &lt;p&gt;&lt;em&gt;File over app&lt;/em&gt; is an appeal to tool makers: accept that all software is ephemeral, and give people ownership over their&amp;nbsp;data.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://stephango.com/file-over-app&quot;&gt;File over app - Steph&amp;nbsp;Ango&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;hr /&gt;
 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;Learn about the systems that already exist, and build on them rather than around them. If an existing system doesn’t do what you want, maybe the problem is in the design of your system, not that&amp;nbsp;one.&lt;/p&gt;
 &lt;p&gt;If you do build a new component, make sure it’s of general utility. Don’t build infrastructure that solves only the problems of your own&amp;nbsp;team.&lt;/p&gt;
 &lt;p&gt;It’s easy to build complexity. In the rush to launch, it’s quicker and easier to code than to redesign. &lt;mark&gt;But the costs accumulate and you lose in the long&amp;nbsp;run.&lt;/mark&gt;&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://commandcenter.blogspot.com/2023/12/simplicity.html&quot;&gt;command center: Simplicity&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/commun/&quot;&gt;#commun&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/dependance/&quot;&gt;#dépendance&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
 </feed>
--- a/david/recherche/index.html
+++ b/david/recherche/index.html
    </template>
    <script id="search-index" type="application/json">[
  {
    "title": "Fourchette",
    "url": "/david/2024/03/21/",
    "date": "2024-03-21",
    "content": "Suite des aventures. Un peu plus de documentation (la d\u00e9mo servant aussi d\u2019introduction). Une licence AGPLv3 qui soit compatible avec l\u2019impl\u00e9mentation principale dont je m\u2019inspire. Je ne sais pas trop si c\u2019est un fork au final, c\u2019est assez hybride comme nouvelle branche, j\u2019ai plus l\u2019impression d\u2019une\u00a0convergence. J\u2019ai surtout travaill\u00e9 sur l\u2019int\u00e9gration du formulaire de saisie du mot de passe qui se situe maintenant dans le Web Component. Je voulais privil\u00e9gier la simplicit\u00e9 d\u2019usage, ce qui implique de prendre quelques raccourcis. J\u2019ai beaucoup h\u00e9sit\u00e9 \u00e0 utiliser un \u00e9l\u00e9ment <dialog> pour le formulaire mais j\u2019ai pr\u00e9f\u00e9r\u00e9 rester\u00a0basique. Il y a encore du travail mais la base me semble utilisable. C\u2019est en essayant de l\u2019int\u00e9grer par ailleurs que je vais me rendre compte de tous les d\u00e9fauts\u00a0actuels. Redis a maintenant un fork\u00a0: redict suite \u00e0 un changement de licence qui n\u2019est plus tout \u00e0 fait open-source, du moins tel que d\u00e9fini par l\u2019OSI. En ayant repris un entra\u00eenement physique assez intensif pour r\u00e9cup\u00e9rer une forme acceptable (car j\u2019ai quand m\u00eame \u00e9t\u00e9 immobilis\u00e9 un moment), je me rends compte que \u00e7a prend un temps non\u00a0n\u00e9gligeable. Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si \u00e7a permet de gagner du temps dans la pr\u00e9paration des pieds, retours dans un\u00a0mois. J\u2019ai aussi r\u00e9duit mon coup de fourchette car le printemps s\u2019en vient et je vais moins avoir besoin de me prot\u00e9ger du froid. M\u00eame si cette sortie course du jour par -15\u00b0C en ressenti \u00e9tait\u00a0piquante\u202f!"
  },
  {
    "title": "PageCrypt",
    "url": "/david/2024/03/20/",
    "date": "2024-01-01",
    "content": "33\u202f% de 44\u00a0millions de consommateurs vont faire le Dry January 22\u202f% des consommateurs ont une conso excessive, c\u2019est-\u00e0-dire 10\u00a0verres/semaine max et plus de deux\u00a0verres/jour. Les seniors sont aussi tr\u00e8s touch\u00e9\u00b7es. L\u2019alcool est une drogue.. On peut faire la f\u00eate sans alcool et\u00a0s\u2019\u00e9clater. Quand on arr\u00eate\u00a0: bienfaits sur le foie, la peau, le coeur, etc\u2026 Pb\u00a0: m\u00e9moire, troubles cognitifs, responsable de cancer, pb sommeil, d\u00e9compensation de maladie psy,\u2026 41000\u00a0d\u00e9c\u00e8s par an en\u00a0France. Les cinq sympt\u00f4mes d\u00e9finissent un probl\u00e8me de\u00a0d\u00e9pendance\u00a0: Perte de\u00a0contr\u00f4le Usage\u00a0compulsif Envie\u00a0r\u00e9pressive Usage\u00a0chronique Cons\u00e9quences psychiques, physiques, sociales,\u2026 Bon Dry J. pour celleux qui le font\u202f! Moi j\u2019en\u00a0suis\u202f! @Air@framapiaf.org Dans mon entourage, de plus en plus de personnes que j\u2019estime ne boivent pas d\u2019alcool, de plus en plus de personnes qui vieillissent en deviennent d\u00e9pendantes. Je suis davantage attir\u00e9 par la premi\u00e8re option\u2026 et pas pour un seul\u00a0mois. Je me sens pr\u00eat, on verra bien o\u00f9 cela me\u00a0m\u00e8ne. Grosse envie de reprendre la CSS par ici en ce d\u00e9but d\u2019ann\u00e9e. Avec le dilemme de faire chuter cette motivation si je publie d\u00e8s maintenant avec l\u2019ancienne (qui restera effective sur les anciens articles). Je vais essayer de me\u00a0retenir."
  },
  {
    "title": "Fourchette",
    "url": "/david/2024/03/21/",
    "date": "2024-03-21",
    "content": "Suite des aventures. Un peu plus de documentation (la d\u00e9mo servant aussi d\u2019introduction). Une licence AGPLv3 qui soit compatible avec l\u2019impl\u00e9mentation principale dont je m\u2019inspire. Je ne sais pas trop si c\u2019est un fork au final, c\u2019est assez hybride comme nouvelle branche, j\u2019ai plus l\u2019impression d\u2019une\u00a0convergence. J\u2019ai surtout travaill\u00e9 sur l\u2019int\u00e9gration du formulaire de saisie du mot de passe qui se situe maintenant dans le Web Component. Je voulais privil\u00e9gier la simplicit\u00e9 d\u2019usage, ce qui implique de prendre quelques raccourcis. J\u2019ai beaucoup h\u00e9sit\u00e9 \u00e0 utiliser un \u00e9l\u00e9ment <dialog> pour le formulaire mais j\u2019ai pr\u00e9f\u00e9r\u00e9 rester\u00a0basique. Il y a encore du travail mais la base me semble utilisable. C\u2019est en essayant de l\u2019int\u00e9grer par ailleurs que je vais me rendre compte de tous les d\u00e9fauts\u00a0actuels. Redis a maintenant un fork\u00a0: redict suite \u00e0 un changement de licence qui n\u2019est plus tout \u00e0 fait open-source, du moins tel que d\u00e9fini par l\u2019OSI. En ayant repris un entra\u00eenement physique assez intensif pour r\u00e9cup\u00e9rer une forme acceptable (car j\u2019ai quand m\u00eame \u00e9t\u00e9 immobilis\u00e9 un moment), je me rends compte que \u00e7a prend un temps non\u00a0n\u00e9gligeable. Un peu par hasard, je commence un traitement AKiLEiNE TANO(+NOK). On va voir si \u00e7a permet de gagner du temps dans la pr\u00e9paration des pieds, retours dans un\u00a0mois. J\u2019ai aussi r\u00e9duit mon coup de fourchette car le printemps s\u2019en vient et je vais moins avoir besoin de me prot\u00e9ger du froid. M\u00eame si cette sortie course du jour par -15\u00b0C en ressenti \u00e9tait\u00a0piquante\u202f!"
  },
  {
    "title": "PageCrypt",
    "url": "/david/2024/03/20/",