Comment Automatiser votre profil GitHub
Aujourd’hui je vais vous montrer comment j’ai automatisé mon profil GitHub.
Photo by alise storsul on Unsplash
Comme vous le savez peut-être, le profil GitHub est devenu une vitrine incontournable lors d’entretien d’embauche. Et GitHub nous fournit les moyens de créer un profil personnalisé.
Mais je dois avouer : Je suis paresseux quand il s'agit de mettre à jour mon profil Github.
J'adore créer du contenu (à la fois sur Medium et sur Youtube). Et je sais que je devrais vraiment créer un lien vers celui-ci depuis mon profil GitHub.
Mais lorsqu'il s'agit de publier ce contenu un peu partout, et notamment sur mon profil, j’ai la flemme, même si je sais bien que ce serait une bonne idée.
Mais je suis partisan de tout automatiser. Et si je peux apprendre des choses dans le processus, c'est gagnant/gagnant.
Et il se trouve que Github nous donne les moyens d'automatiser les processus, grâce à un outil appelé Github Actions.
Voyons donc ce que nous pouvons faire avec ça. Nous allons :
- Créer un repository special de profil.
- Configurer un template Markscribe
- Récupérer des flux RSS de Medium
- Récupérer le contenu et les statistiques de YouTube (en utilisant Shields.io)
- Configurer les actions GitHub
- Et retourner se reposer. Ou pas.
Voici le résultat auquel je suis arrivé. Si ça vous intéresse d’en faire autant… C’est par ici que ça se passe !
Et si vous souhaitez copier du code depuis mon dépôt, n’hésitez pas, je vous ai mis dans la description le lien à la fois vers le profil et vers le dépôt qui l’automatise.
Créer un repository pour le profil
La première étape, si vous ne l'avez pas encore fait, est de créer un dépôt spécial dans GitHub qui servira de profil (dont le fichier README.md fournit le contenu de la page de profil).
C'est très simple : pour un compte personnel, créez un dépôt (ou repository) portant le même nom que votre nom d'utilisateur GitHub.
GitHub vous indiquera alors que vous avez trouvé un dépôt spécial. La première étape consiste à cloner ce dépôt localement sur votre ordinateur.
Une fois que c'est fait, nous sommes prêts à passer à la suite.
Mise en place du modèle Markscribe
Pour générer le fichier README, nous allons utiliser un outil du nom de Markscribe. Cet outil permet d’utliser des templates pour générer des fichiers markdown, en utilisant la syntaxe du langage de template go.
Si vous ne savez pas comment utiliser la syntaxe des templates go, ne vous inquiétez pas, je le connais pas non plus.
Mais c’est est assez facile de comprendre ce qui se passe, comme vous le verrez si vous regardez le modèle d'exemple.
En fait, la première étape consiste à créer un fichier template/README.md.tpl et à y copier le contenu du modèle d'exemple. Le modèle ressemble à quelque chose comme ceci :
La première chose à faire c’est d’ajouter une image d'en-tête en haut. Pour ça on rajoute le fichier au dépôt. Moi je l’ai appelé header.jpg et je l’ai mis dans un dossier image. Et puis en haut du fichier j’ai écrit :
Je vous conseille de mettre à jour également la section “Comment me joindre” (ou “How To Get in Touch”) en bas de page.
Il n’y a pas forcément besoin d’adapter quoi que ce soit sur la partie spécifique à GitHub, mais on va rajouter des flux RSS.
Pour ma part je vais récupérer les articles que j’écris sur Medium en anglais, mais c’est valable pour n’importe quel flux RSS.
La structure de base d'une section RSS générique est quelque chose comme ceci , avec une boucle qui commence avec “range rss”, puis l’url du flux RSS et le nombre d’éléments récupérés.
Ensuite nous avons une ligne dans la boucle, avec le titre sous la forme d’un lien (en suivant la syntaxe de Markdown) et avec l’indication du temps depuis la publication.
Ici il suffit de remplacer l'url ("https://.../posts/index.xml") par une valeur valide. Et pour récupérer le flux RSS d’articles Medium, il suffit d'ajouter votre nom d'utilisateur Medium dans "https://medium.com/feed/@<username>". Ainsi, par exemple, mon flux est https://medium.com/feed/@gosev.
La récupération du contenu de YouTube est aussi simple, du moins au début. Le flux RSS des dernières vidéos d'une chaîne se récupère avec l’url : Https, www YouTube point com, slash feeds, slash videos point XML, puis : Point d’interrogations, Channel sous tiret id égale et là on précise l’identifiant de la chaine. Ceci étant, vous me connaissez : je vais pas me satisfaire de quelque chose d’aussi basique que ça.
Après tout, on peut aussi afficher des images dans son profil GitHub, ce qui laisse des possibilités intéressantes.
Par exemple, si vous ajoutez :
<img src="https://img.shields.io/youtube/channel/subscribers/<id>?style=for-the-badge"></img>.
En remplaçant l’id avec celui de la chaîne, vous vous retrouvez avec un badge qui ressemble à ceci
<img src="https://img.shields.io/youtube/channel/subscribers/UCzdX32OIhpfrdxQRhN2s98w?style=for-the-badge"></img>
Et si nous sous la main l'URL de la vidéo, nous sommes également capables de déduire l'URL de la vignette.
Il suffit de ne garder que ce qui se trouve dans l’URL à partir du 32ème caractère, et avec ça nous obtenons l'Id de la vidéo.
Et la vignette se trouve à l'adresse suivante (en remplaçant l’id de la video) :
https://img.youtube.com/vi/
Avec tout ça nous pouvons créer notre section.
On commence par lui donner un titre, avec deux signes hash `##`
Puis on met un compteur qui permet de voir le nombre d’abonnés, en utilisant une image générée automatiquement via Shields io
Vient ensuite la liste des videos.
Il faut savoir que le markdown ne supporte pas bien les tableau, qu’il faut donc créer en HTML.
Il ne reste plus qu'à formater les résultats sous forme de tableau en utilisant le HTML pour avoir les vignettes à gauche et les titres à droite et à ajouter un badge shield.io qui indique le nombre de vues d'une vidéo.
Ainsi, une section ressemble à ceci en code, avec une balise table en ouverture, puis la boucle avec le range rss.
Ensuite à l’intérieur de la boucle on fait des rangées de table avec des balises `<tr>`.
Et dans ces balises `<tr>` on fait une premier cellule (avec `<td>`), où on met la vignette de la vidéo.
Et dans la deuxième cellule on met un lien avec un titre, et un badge avec le nombre de vues.
Au final, cela ressemble à quelque chose comme ça.
Alors, maintenant que nous avons mis cela en place... il est temps d'automatiser les mises à jour du profil !
La première chose à faire (si vous n'en avez pas déjà un) est de configurer un jeton d'accès personnel sur GitHub. Vous devez aller ici dans Developer settings \> Personal access tokens \> Generate new token.
Vous aurez besoin des scopes suivants : repo status, public repo, read user et read org.
Je vous conseille de lui donner une durée de vie indéfinie.
Le token ressemblera à quelque chose comme ceci
Ici je vous conseille de l'enregistrer dans un endroit sûr puisque GitHub ne vous le montrera plus.
Ensuite, allez dans votre dépôt de profil, puis allez dans Paramètres \> Secrets \> Actions et cliquez sur Nouveau secret de dépôt .
Ici, vous devez créer un nouveau secret appelé PERSONAL (sous tiret) GITHUB (sous tiret) TOKEN et coller le jeton que vous venez de créer.
Voilà, il ne nous reste plus qu'à configurer l'action GitHub.
Pour cela, nous allons créer un dossier appelé `.github` et dans ce dossier, un autre appelé `workflows` .
À l'intérieur du dossier `.github/workflows`, créez un fichier appelé `readme.yaml` que vous pouvez voir ci dessous. Je vous ai également mis un lien vers le code de ce fichier dans la description.
Et pour celui là il n’y a rien à changer ou presque. Voyons voir que fait cette action.
Tout d’abord, l’action est configurée pour s'exécuter toutes les heures et à chaque push.
Elle contient un job avec trois étapes simples :
* Récupérer le code du dépôt
* Faire le rendu du template en utilisant le jeton d'accès personnel
* Repousser le code vers le référentiel
Attention : si le profil est celui d'une organisation (comme le mien), assurez-vous de mettre à jour le chemin du fichier de sortie README dans l'étape de rendu du modèle.
Maintenant, commitez le fichier et faites un git push vers le dépôt distant.
Tout devrait fonctionner. Vous pouvez le vérifier en allant dans l'onglet Actions du dépôt (ou repository) de votre profil et en vérifiant quelles sont les actions de déconnexion.
Maintenant que c'est fait, vous devriez avoir un profil automatiquement mis à jour. C’est cool c’est le moment de se détendre… ou de se remettre à produire du contenu pour étoffer votre profil !
Ou si vous avez la flemme, je vous invite à regarder une nouvelle vidéo !
