ajout du billet sur la création des supports pour le cours sur l'IN

1 files changed, 200 insertions, 0 deletions

diff --git a/src/posts/2024-01-10-preparation-du-cours-identite-numerique.md b/src/posts/2024-01-10-preparation-du-cours-identite-numerique.md
new file mode 100644
index 0000000..096e680
--- /dev/null
+++ b/src/posts/2024-01-10-preparation-du-cours-identite-numerique.md
@@ -0,0 +1,200 @@
+---
+title: 'Préparation du cours Identités numériques avec Quarto'
+date: 2024-01-10
+---
+
+Pour ce billet je vais présenter l'environnement d'écriture que j'utilise pour
+le cours sur les identités numériques dispensé à l'Université Paris Nanterre.
+
+## Un peu de contexte
+
+Depuis un peu plus de deux ans je teste différents dispositifs numérique
+d'écriture allant d'interface de gestion sur le Web aux éditeurs de texte
+intégrés au terminal comme vi ou emacs.
+
+Un fait intéressant est que pour la plupart des solutions qui me conviennent, je
+les garde installées sur ma machine (ou je garde un accès avec un compte en
+ligne) et elles me servent pour un usage spécifique.
+
+Par exemple pour saisir des notes ou des ébauches d'idées je me sert souvent de
+l'application Stylo (quelques notes collaboratives y trainent depuis que la
+fonctionnalité a été déployée).
+Alors que pour saisir des notes de réunion ou pouvoir les partager rapidement
+(tout en sachant que le contenu est complètement accessible pour qui a l'URL)
+j'utilise Hedgedoc.
+
+À l'occasion de la coécriture du rapport de recherche sur les forges de
+publication avec Antoine, j'ai pu tester assez longuement Quarto.
+
+C'est un système que j'ai laissé tomber pour mon carnet personnel (je préfère de
+loin celui-ci).
+Cependant, je continue pour l'instant de l'utiliser pour créer de petites
+pages Web pour mes cours comme c'est le cas pour le cours sur les identités
+numériques (cf
+<https://identites-numeriques.en-cours-de.construction>).
+
+Le site web est hébergé via le service gitpage sur GitHub. Le répertoire du site
+se trouve ici : <https://github.com/RochDLY/identite_numerique>
+
+## Environnement d'écriture
+
+En plus d'installer Quarto sur son ordinateur, on a la possibilité de l'utiliser
+dans différents environnements qui intègrent un plugin (pour faciliter son usage).
+Dans mon cas je pourrais très bien l'utiliser dans Neovim (il s'agit de mon
+environnement d'écriture le plus régulier), toutefois je me suis heurté à
+un problème qu'il me semble difficile de contourner alors je l'utilise plutôt
+dans VSCodium qui a l'avantage d'intégrer des boutons pour la transformation des
+documents (et surtout pour la prévisualisation !).
+
+Le problème rencontré dans Neovim (avec Quarto) est le suivant : étant sous une
+distribution dont la fréquence de mise à jour des paquets est relativement basse
+pour des raisons de stabilité, je me retrouve régulièrement avec une version de
+Quarto qui nécessite une version de Neovim qui n'est pas encore disponible dans
+le gestionnaire de paquet de Devuan.
+
+(J'ai d'ailleurs un peu le même problème avec la version de LazyVim.)
+
+En conséquence, je suis obligé de compiler manuellement Neovim pour avoir une
+version compatible avec l'utilisation de Quarto dans cet environnement.
+
+Étant donné que l'objectif est de ne pas aller à l'encontre du fonctionnement de
+Devuan (si je dois faire la même chose pour tous les logiciels que j'utilise il
+deviendrait nécessaire de se poser la question de la pertinence du choix du
+système d'exploitation), je préfère utiliser VSCodium.
+
+## Configuration de Quarto
+
+### Le site web
+
+Du côté de Quarto c'est assez simple à mettre en oeuvre.
+
+Dans l'éditeur VSCodium, il suffit de créer un nouveau projet (_website_) et de
+remplir les entrées du fichiers de configuration YAML `_quarto.yml`.
+
+Pour ce site, les informations sont les suivantes :
+
+```YAML
+project:
+  type: website
+
+website:
+  title: "Identités numériques"
+  sidebar:
+    style: "floating"
+    search: true
+    contents:
+      - index.qmd
+      - posts/bibliographie.qmd
+      - section: "Séances de cours"
+        contents:
+          - posts/170124.qmd
+      - section: "Outils"
+        contents:
+          - tools/gephi.qmd
+          - tools/redaction.qmd
+          - tools/stylo.qmd
+          - tools/terminal.qmd
+  page-footer:
+    left: "© 2024 WTFPL, Roch Delannay"
+    right: "Ce site a été réalisé avec [Quarto](https://quarto.org)"
+
+format:
+  html:
+    theme: flatly
+    css: styles.css
+    toc: true
+
+```
+
+Le thème `flatly` utilisé n'est pas du tout modifié à l'exception de l'affichage
+des balises `<iframe>` que je voulais un peu plus large pour y insérer les
+slides prévues pour le cours.
+
+En plus de l'index.qmd, on trouve toutes les ressources que j'utilise pour mon
+cours dans des dossier séparés à la racine du projet :
+
+- les billets (`posts/`)
+- les `images/`
+- les `slides/`
+- des fiches d'aide (`tools/`)
+
+Chaque nouvelle séance de cours fait l'objet d'un document qui est inséré dans
+`posts/` auquel j'adjoins 3 entrées YAML en en-tête :
+
+```YAML
+---
+title: "17 janvier 2024"
+bibliography: chemin/vers/la/bibliographie.bib
+nocite: false
+---
+```
+
+Je donne pour titre du document la date du cours.
+Ce titre est récupéré et apparaît dans le menu de navigation à gauche de
+l'écran.
+
+Étant donné que je travaille seul à l'édition de ce site web, j'utilise une
+petite astuce pour mettre à jour facilement mon fichier de références
+bibliographiques.
+Ce document est créé depuis l'application Zotero (avec le plug-in Better BibTeX)
+en exportant une bibliographie au format BibTeX avec l'option "Garder à jour".
+De cette manière, je n'exporte la bibliographie qu'une seule fois et lorsque je
+fais des mises à jour sur Zotero, le document exportés est également mis à jour.
+Ainsi, je n'ai plus qu'à reconstruire le site avec Quarto pour modifier les
+références bibliographiques du site web.
+
+### Les slides
+
+Je ne suis pas friand d'utiliser des slides pendant les cours, surtout lorsque
+je prépare un site web pour rendre disponible les différentes ressources.
+Vu que c'est une demande récurrente des étudiants, c'est quelque chose que j'ai
+intégré à leur demande (bien que mes slides soient bien pauvres en contenu).
+
+J'ai essayé de m'inspirer de ce que propose Antoine Fauchié a ses étudiants.
+Il leur met à disposition un site web qui contient tous les supports de cours, y
+compris les slides.
+La beauté de l'environnement proposé par Antoine est de n'écrire qu'une seule
+fois ses contenus qui approvisionnent ensuite les slides et le site web.
+
+Néanmoins, je n'avais pas forcément besoin d'un tel système (avec la redondance
+du contenu des notes dans les slides et dans les pages web).
+
+Par contre, et c'est là que Quarto devient très pratique, je peux très
+facilement intégrer des slides générées avec Quarto (en surcouche à RevealJS via
+Pandoc) et les encapsuler dans le site du cours puisque les deux supports sont
+au même format HTML !
+
+(La suite devient un peu crade)
+
+Plutôt que d'avoir tout une configuration RevealJS (c'est prévu pour plus tard),
+je peux pour l'instant créer un simple document avec Quarto auquel je passe le
+YAML suivant :
+
+```YAML
+---
+title: "Titre de la séance"
+author: "Roch Delannay"
+date: "17 janvier 2024"
+bibliography: /chemin/vers/la/bibliographie.bib
+suppress-bibliography: true
+format: 
+    revealjs: 
+        incremental: false
+        scrollable: true
+        theme: [simple, custom.scss]
+        footer: "4L4IC01P - Université Paris Nanterre - Hiver 2024"
+        embed-resources: true
+---
+```
+
+Le gros tips de ce document là est le dernier paramètre passé au YAML, le
+`embed-resources` permet de ne produire qu'un seul fichier HTML qui contient
+absolument toutes les ressources nécessaire pour faire tourner les slides
+correctement (images, scripts, styles, etc.).
+
+Une fois produit, je déplace ce fichier dans le répertoire du projet du cours
+dans le dossier `slides/` et je l'encapsule dans la page de mon cours au moyen
+d'une `<iframe>`.
+Comme le document HTML est également disponible à sa propre URL, il est aussi
+très simple d'y accéder en plein écran pour naviguer facilement entre les
+différents supports.