[🛠] Créer un MVP de suivi alimentaire dans le blog

✨ Résumé de GPT-5.6 Sol 　

Le récit de la transformation d’un journal alimentaire qui s’accumulait automatiquement, mais que je ne lisais même pas, en une petite application intégrée au blog que j’utilise et améliore comme MVP.

Version 1 : beaucoup de données, mais une lisibilité catastrophique

J’ai commencé à enregistrer mes données corporelles et les aliments consommés le 20 juin 2026.

La saisie elle-même n’était pas difficile. Il me suffisait d’envoyer une photo du repas : Codex recherchait les données nutritionnelles sur FatSecret, les enregistrait et ajoutait le lien. En revanche, la lisibilité était catastrophique. Je ne le lisais même pas moi-même, alors personne d’autre ne devait le faire.

Version 2 : replier le détail des repas et ajouter les 7 derniers jours

J’ai modifié le format à partir du 10 juillet 2026.

J’ai masqué le détail des aliments derrière un contrôle d’ouverture et de fermeture, pour en faire surtout une archive que l’IA pouvait parcourir. J’ai aussi amélioré la lisibilité générale et ajouté l’évolution des 7 derniers jours. Le journal a alors commencé à me fournir un véritable retour.

« Voilà donc combien de calories j’ai réellement consommées, et comment mon poids a évolué en conséquence. » Cela commençait enfin à apparaître clairement.

Malgré tout, l’ensemble restait difficile à saisir d’un coup d’œil. Le format encore très textuel semblait en être la cause. Puisque je pouvais demander à Codex de le faire, j’ai envisagé d’intégrer directement dans la page une petite visionneuse au style d’une application.

Version 3 : une petite application dans le blog rend tout beaucoup plus lisible

À partir d’aujourd’hui, j’ai adopté cette version.

J’ai expliqué à Codex, une par une, les fonctions que je voulais, puis j’ai continué à lui donner mes retours. En une heure, le résultat attendu fonctionnait dans l’article.

Présentées comme un écran d’application, les informations montraient immédiatement le type de repas pris à chaque moment de la journée et les aliments consommés. Mon autoévaluation est devenue bien plus simple. L’ensemble ressemblait beaucoup à Pillyze, une application que j’utilisais souvent auparavant.

J’ai enregistré les données dans le front matter et dessiné l’interface avec Liquid

Le résultat ressemble à une application, mais je n’ai pas créé une autre application pour la saisie. J’écris les données body_review en YAML dans le front matter placé en haut du fichier Markdown de chaque Daily Review.

body_review:
  today:
    exercise:
      aerobic: []
      anaerobic: []
    nutrition:
      complete: true
      meals:
        - type: lunch
          foods:
            - name: Riz au porc épicé
              calories_kcal: 779
              macros_g:
                carbohydrate: 115.13
                protein: 29.85
                fat: 21.41

Au lieu de répéter le HTML dans chaque article, le corps appelle une seule fois la visionneuse partagée avec le {% include %} de Liquid.

{% include body-review.html review=page.body_review %}

Lors du build Jekyll, page.body_review est transmis à _includes/body-review.html, qui affiche les cartes, les activités physiques, les onglets de repas et les graphiques de macronutriments. Lorsqu’aucun repas n’est enregistré pour une période, comme le petit-déjeuner ou une collation tardive, l’onglet correspondant n’est même pas créé. Une fois les calories et les macronutriments de chaque aliment saisis, le moteur de rendu calcule les totaux par repas, le total général et les pourcentages. Les notes et l’évaluation des habitudes alimentaires ne sont pas calculées par l’écran : Codex les juge du point de vue du régime, puis j’enregistre directement les valeurs dans le front matter.

Les Daily Reviews suivantes n’ont donc besoin que des données du jour, sans recopier le même code d’interface.

Dogfooding du MVP

Je compte continuer à l’utiliser et améliorer progressivement ce qui reste gênant. Je me suis aussi dit que je pourrais un jour proposer un service associé, relié au web et à une application.

Il s’agit en pratique d’un MVP intégré au blog avant de passer au développement complet de l’application, et d’une démarche de dogfooding¹. Quand j’en aurai le temps, je veux construire progressivement l’application native et web avec Codex et Flutter, puis permettre à terme d’intégrer ses données dans le blog.

Références

1. Le dogfooding consiste, pour les personnes qui développent un produit, à l’utiliser elles-mêmes dans un environnement réel afin d’en vérifier la valeur et la facilité d’usage. L’explication du Lean Product sur le Microsoft Azure DevOps Blog le présente également comme l’utilisation du produit par ses créateurs avant d’affiner davantage le MVP. ↩