<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
  xmlns:dc="http://purl.org/dc/elements/1.1/"
  xmlns:content="http://purl.org/rss/1.0/modules/content/"
  xmlns:atom="http://www.w3.org/2005/Atom"
  >
  
  <channel>
    <dc:rights>Copyright 2026 Heini Fagerlund</dc:rights>
    <title>BYTESofDESIGN.com: Projets open source</title>
    <link>https://bytesofdesign.com/rss_fr.xml/</link>
    <description>Portfolio de Heini Fagerlund développeuse d'applications web full stack spécialisée dans l'accessibilité web.</description>
    <dc:language>fr</dc:language>
    <dc:creator>info@bytesofdesign.com (Heini Fagerlund)</dc:creator>
    <atom:link href="https://bytesofdesign.com/rss_fr.xml" rel="self" type="application/rss+xml" />
    <item>
      <title>Dockerisation d'une application Erlang</title>
      <link>https://bytesofdesign.com/#article_erlang</link>
      <guid>
https://bytesofdesign.com/#article_erlang
</guid>
      <pubDate>Wed, 15 Jul 2020 09:56:51 GMT</pubDate>
      <description>
      <![CDATA[<p>Ce projet a commencé comme un programme simple 'hello world' qui illustre le fonctionnement de la langue Erlang, <a href="https://github.com/hfagerlund/erlang-experiments/tree/155c37ea622123dc0c5e6b2fc75379a9c8ff2c8d" title="Examinez la structure d'Erlang/OTP initiale (v0.1.0)">organisé plus tard au structure d'Erlang/OTP</a> utilisant un fichier Emakefile pour compiler des sources et pour permettre la séparation des fichiers sources, de test, et '.beam'. EUnit a également été ajouté pour réaliser des tests unitaires.</p>
    <p><a href="https://github.com/hfagerlund/erlang-experiments/tree/29a853b0e62e1115830e68edb172075022a172cf" title="Examinez la version initiale post installation de Docker">Après l'installation de Docker</a>, on peut connecter directement au shell (interactif) d'un conteneur, au lieu d'un shell d'Erlang, pour exécuter la compilation. Le Dockerfile (1.) a compilé un programme minimal en langage Erlang qui produit un fichier BEAM pour l'exécution sur la VM Erlang, et alors (2.) a exécuté le programme séquentiel Erlang comme un script commun puis quitté.</p>
    <p><a href="https://github.com/hfagerlund/erlang-experiments/tree/3633a14ff052228c139ae8b2df4b6902efbf17ef" title="Examinez la version initiale post installation de Docker Compose">Docker Compose</a> a simplifié la façon dont le programme a été lancé. <a href="https://github.com/hfagerlund/erlang-experiments/tree/71c50843eca7c9f9e8258a8f1c3c4330e819f3dd" title="Examinez la version initiale post installation de conteneurs Dev">Les conteneurs de développement (conteneurs Dev)</a> &mdash; qu'on peut utiliser dans ou sans VSCode &mdash; sont une autre couche (optionnelle) pour garantir la reproductibilité environnementale.</p>
        <p>Dans la <a href="https://github.com/hfagerlund/erlang-experiments/releases/tag/v0.2.0" title="Examinez le code source de tag v0.2.0">prochaine itération (v0.2.0)</a>, Rebar3 &mdash; un outil de compilation et un gestionnaire de paquets pour l'Erlang &mdash; a été utilisé pour générer automatiquement la structure d'application (dans un sous-répertoire, puis déplacé à la racine du projet). Notez: Rebar3 ne remplace le système de fichiers OTP &mdash; au contraire, cela vous permettez de créer vos applications conformes aux spécifications d'Erlang/OTP plus facilement. La modification de l'exemple <a href="https://github.com/hfagerlund/erlang-experiments/blob/master/src/hello.erl" title="Examinez le code source de hello.erl v0.2.0">'hello.erl'</a> a aussi été effectuée.</p>]]>
        </description>
    </item>
    <!-- *** -->
    <item>
      <title>Architecture de composants</title>
      <link>https://bytesofdesign.com/#article_react</link>
      <guid>
https://bytesofdesign.com/#article_react
</guid>
      <pubDate>Wed, 28 Mar 2018 05:47:15 GMT</pubDate>
      <description>
      <![CDATA[
      <p>Le projet <a href="https://hfagerlund.github.io/elections-carousel-component/">elections-carousel-component</a> comprend une collection des composants qui reçoit des données externes des résultats des élections importées via l'API et les affiche sous la forme d'un carrousel.</p>
        <p><img src="https://bytesofdesign.com/img/screenshot_elections.jpeg" alt="Capture d'écran du projet elections-carousel-component" /></p>
        
        <p>La hiérarchie des composants est illustrée à la <a href="https://bytesofdesign.com/#component-hierarchy" title="Figure 1: Hiérarchie des composants React">Figure 1</a>, qui présente l'ensemble des sept types (huit types, si le composant ErrorBoundary est pris en compte dans le montant total).</p>
        <p><img src="https://bytesofdesign.com/img/component-hierarchy.jpeg" alt="Figure 1: elections-carousel-component: La hiérarchie des composants" /></p>
        
        <p>Tous les composants ont été écrits en React (une approche simple pour ce projet de démonstration, pas utilisant Flux ou Redux), et échangent entre eux des données, comme montré ci-dessous:</p>
        <p><img src="https://bytesofdesign.com/img/communication-composants-via-parent_react.jpeg" alt="Figure 2: le flux de données au sein d'une application React" /></p>
        <p><a href="https://github.com/hfagerlund/elections-carousel-component/" title="Examinez le code source de 'elections-carousel-component'">Le code source entier</a> est fourni sur GitHub.</p>
    ]]>
      </description>
    </item>
    <!-- *** -->
    <item>
      <title>docSkimmer thème pour MkDocs</title>
      <link>https://bytesofdesign.com/#article_docskimmer</link>
      <guid>
https://bytesofdesign.com/#article_docskimmer
</guid>
      <pubDate>Sat, 17 Jun 2017 16:20:00 GMT</pubDate>
      <description>
      <![CDATA[
      <p>Mon nouveau <a href="https://github.com/hfagerlund/mkdocs-docskimmer/" title="Examinez le code source de mkdocs-docskimmer">thème docSkimmer</a> pour <a href="https://github.com/mkdocs/mkdocs/">MkDocs</a> est maintenant disponible sur <a href="https://github.com/" title="Visitez GitHub.com">GitHub</a>. 
          <p><img src="https://bytesofdesign.com/img/mkdocs-docskimmer.jpeg" alt="Figure 3: Capture d'écran du thème docSkimmer" /></p>
          <p>Une démonstration du thème docSkimmer est présenté sur <a href="https://hfagerlund.github.io/mkdocs-docskimmer/" title="Examinez la documentation pour mkdocs-docskimmer">son propre site Web de documentation</a>, qui l'utilise directement prêt à l'emploi .</p>
        <p>Un autre exemple d'un <a href="https://hfagerlund.github.io/elections-carousel/" title="Examinez le site Web de documentation pour le repository 'elections-carousel'">site Web de documentation qui utilise le thème docSkimmer</a> démontre comment ce thème peut être personnalisé aisément.</p>

        <p>Projets connexes:</p>
        <ul><li>Vérifiez la compatibilité du thème docSkimmer avec des versions de MkDocs, sans avoir besoin d'installer, en utilisant <a href="https://github.com/hfagerlund/docker-for-docskimmer" title="Examinez le repository de docker-for-docskimmer sur GitHub">docker-for-docskimmer</a>.</li>
        <li>Ajouter des feuilles de style externes persistantes, préférées et/ou alternatives aux thèmes 'custom' (non-intégré) de MkDocs en utilisant <a href="https://github.com/hfagerlund/mkdocs-docstyler-plugin" title="Examinez le repository de mkdocs-docstyler-plugin sur GitHub">mkdocs-docstyler-plugin</a>.</li>
          
        <li>Ce thème a aussi été porté pour Jekyll. Voyez une démo sur <a href="https://hfagerlund.github.io/" title="Examinez mon site sur GitHub Pages">mon site GitHub Pages</a>.
        Téléchargez la dernière version de <a href="https://github.com/hfagerlund/jekyll-docskimmer-theme/releases" title="Examinez le repository du thème docSkimmer pour Jekyll">jekyll-docskimmer-theme</a>.</li></ul>
    ]]>
      </description>
    </item>
    <!-- *** -->
     <item>
      <title>Écrivez une fois, plusieurs façons d'enregistrer le log</title>
      <link>https://bytesofdesign.com/#article_git-add-msg</link>
      <guid>https://bytesofdesign.com/#article_git-add-msg</guid>
      <pubDate>Thu, 16 Jul 2015 23:39:11 GMT</pubDate>
      <description>
      <![CDATA[
      <p>
          <a href="https://github.com/hfagerlund/git-add-msg/" title="Examinez le repository de git-add-msg sur GitHub">git-add-msg</a> est un outil de ligne de commande que j'ai développée pour optimiser l'utilisation de Git, tout seule ou avec Trac, pour gagner du temps (et pour économiser de taper). Au lieu de taper les lignes suivantes (dans le répertoire principal de votre projet):</p>
        <figure>
          <figcaption>Commandes shell requises avant l'installation de <a href="https://github.com/hfagerlund/git-add-msg/" title="Examinez le repository de git-add-msg sur GitHub">git-add-msg</a></figcaption>
          <pre><code>
          $ git add .
          $ git commit -am "mon message de commit"
          # ou pour les utilisateurs de Trac:
          $ git commit -am "#123: mon message de commit"
          </code></pre>
      </figure>

      <figure>
          <figcaption>Figure 2. Après l'installation de <a href="https://github.com/hfagerlund/git-add-msg/" title="Examinez le repository de git-add-msg sur GitHub">git-add-msg</a>, une seule commande est nécessaire</figcaption>
          <pre><code>
          $ git add-msg
          </code></pre>
      </figure>
            
      <p>Et il n'est pas non plus utile de couper-et-collager-au-Trac des hashs des commits, car un commentaire avec un lien au changeset et le dépôt (aussi bien que le message de commit lui-même) est ajouté automatiquement au billet spécifié dans Trac. Les informations de la commande <code> $ git log </code> pour chaque commit sont aussi ajoutées dans un fichier texte changelog &mdash; on pourrait mettre en copie un autre système de gestion de bugs ou de projets, si on voulait.</p>
      
       <p>Fonctionnalités de git-add-msg (v.0.1.1):</p>
        <ul>
        <li>Accepte des messages de commit multiligne (notez bien: l'affichage des sauts de ligne c'est un problème connu...);</li>
        <li>Interdit un champ de saisie vide pour le message de commit;</li>
        <li>Génère un lien au changeset et le dépôt automatiquement au billet spécifié dans Trac (bien pratique lorsque vous avez plusieurs dépôts en même environnement Trac);</li>
        <li>Permet de changer le nom du dépôt associé avec le billet dans Trac par l'option <code>-r</code>;</li>
        <li>Affiche un message d'erreur si le message de commit ne pourra pas être transmise au Trac.</li>
        </ul>
        <p>Profitez bien de l'outil!</p>
    ]]>
      </description>
    </item>
    <!-- *** -->
  </channel>
</rss>