This is the second article in a series of articles on Source Control for Microsoft 365 Tenant Admins. In this article, Andy Schneider explains how to use Git's capabilities and processes to easily collaborate and co-develop code.
The post Source Control for Microsoft 365 Tenant Admins: Part II appeared first on Practical 365.
Dans les deux premiers billets de cette série, nous avons vu comment créer notre bucket de base, configurer notre nom de domaine, et manipuler rapidement Hugo.
Dans ce dernier billet de la série, nous allons donc passer à l'étape manquante : le déploiement.
Nous allons commencer par créer un utilisateur API sur la console Scaleway.
Pour cela, rendez-vous sur le menu en haut à droite, puis "Identifiants"
Cliquez ensuite sur "Générer une nouvelle clé API", puis donnez-lui un nom.
Copiez de suite les identifiants, il ne sera pas possible de les récupérer ensuite!
Dans votre repository Github, rendez-vous dans "Settings", puis "Secrets"
Nous allons créer deux secrets :
Connexion
AWS_ACCESS_KEY_ID: qui porte la clé publiqueAWS_SECRET_ACCESS_KEY : qui porte la clé privéeCes secrets ne sont pas récupérables directement, à part par votre pipeline de déploiement.
Scaleway exploitant le standard S3 d'AWS, nous allons utiliser la ligne de commande d'Amazon pour pousser sur S3.
Toutefois, nous aurons besoin de configurer le client pour qu'il pointe vers scaleway au lieu d'AWS.
La configuration nécessaire est décrite sur la documentation officielle de Scaleway :
Scaleway DocumentationPour ma part, j'ai donc créé un répertoire aws à la racine de mon repository, qui a simplement un fichier config avec le contenu suivant :
[plugins]
cli_legacy_plugin_path = /home/runner/.local/lib/python3.8/site-packages
endpoint = awscli_plugin_endpoint
[default]
region = fr-par
s3 =
endpoint_url = https://s3.fr-par.scw.cloud
signature_version = s3v4
max_concurrent_requests = 3
max_queue_size = 1000
multipart_threshold = 5000MB
multipart_chunksize = 1000MB
s3api =
endpoint_url = https://s3.fr-par.scw.cloud
retries =
max_attempts = 20
Enfin, nous allons préparer un fichier de configuration pour notre pipeline, c'est ce dernier qui se chargera de livrer chaque modification sur notre bucket.
Pour ce faire, nous allons créer le fichier .github/workflows/deploy/yml, dans lequel nous allons mettre le contenu suivant :
name: CI
on:
push:
branches: [ main ]
pull_request:
branches: [ main ]
workflow_dispatch:
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- name: Install Hugo engine
run: sudo apt update && sudo apt install -y hugo unzip python3-pip
- name: Install Aws CLI v2
run: |
curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "/tmp/awscliv2.zip"
cd /tmp
unzip awscliv2.zip
sudo ./aws/install --update
cd -
- name: Install awscli_plugin_endpoint
run: pip3 install awscli_plugin_endpoint && pip3 show awscli_plugin_endpoint
- name: copy ScaleWay AWS CLI configuration
run: |
mkdir ~/.aws
cp ./aws/config ~/.aws/config
- name: Compile items
run: hugo -D
- name: Push to Scaleway storage
env:
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
run: /usr/local/bin/aws s3 sync --delete ./public/ s3://demo-hugo.tferdinand.net/
Ce fichier indique plusieurs informations :
Concernant ces étapes nous avons donc :
--delete permettant de supprimer les fichiers qui ne sont éventuellement plus présentsMaintenant que tout est prêt, il est temps de faire un gros push vers Github.
Si vous allez sur l'interface, dans l'onglet "actions" vous devriez voir votre pipeline tourner.
En quelques minutes, il devrait avoir fini :
Et si vous allez sur votre bucket sur Scaleway, vos objets sont bien présents :
Enfin, si nous retournons sur notre record DNS que nous avions créé plus tôt, nous avons bien notre site qui s'affiche :
Dans ce billet, je n'ai fait que survoler Hugo. Si vous voulez en savoir plus, je vous encourage vivement à visiter la documentation du projet, qui a le mérite d'être très accessible.
NewsLe stockage objet de scaleway est adapté si vous voulez commencer un blog sans prendre de risque.
En effet, il ne coûte rien, et vous permet d'avoir un service de qualité sans avoir besoin de passer du temps à le maintenir en fonctionnement.
De plus, cela vous permet d'héberger vos données en France, par un acteur français!
J'ai fait le choix de Github pour ce billet, mais j'aurais pu aller jusqu'au Github pages, qui permettent aussi d'héberger du contenu statique. J'ai choisi de mettre Scaleway comme point final, car je voulais montrer qu'on pouvait aussi héberger en France sans avoir plus de difficultés.
Comme je l'ai dit plusieurs fois, ces billets sont une simple base, beaucoup de choses sont améliorables, et beaucoup de chemins alternatifs sont possibles.
Le but est simplement de montrer une solution, fonctionnelle de bout en bout.
N'hésitez pas à réagir dans les commentaires si vous voyez des points à améliorer!
Dans mon billet précédent, nous avons créer le socle nécessaire pour recevoir notre code et notre site terminé.
Si vous ne l'avez pas lu, vous pouvez le retrouver ici:
TFerdinand.netTeddy FERDINANDCette semaine, nous allons passer à Hugo. Nous allons voir comment l'utiliser de manière très basique pour créer notre blog, et nous créerons le repository Github qui hébergera le code de notre blog.
Pour ce billet, j'ai choisi d'héberger le contenu sur Github, rien n'empêche de l'héberger ailleurs.
L'intérêt de Github est multiple :
Donc, nous allons donc créer un repository Github, que vous pouvez mettre en public ou privé selon ce que vous préférez.
Ce repository portera donc notre "code Hugo" ainsi que le pipeline de déploiement, puisque comme je l'ai dit plus haut, j'utiliserai Github actions pour le déploiement et les mises à jour de mon blog.
Sur mon ordinateur, je vais donc cloner mon repository tout beau tout neuf, puis je vais installer Hugo.
Pour cela, je vous invite à consulter la documentation officielle à ce propos, qui vous permettra de choisir la solution la plus adaptée à votre besoin.
NewsUne fois le blog installé, je vais donc initialiser mon blog, depuis mon répertoire Github, je vais donc lancer :
hugo new site --force .Le --force est nécessaire, car nous ne sommes pas forcément dans un répertoire vide (si vous avez choisi de mettre un readme par exemple).
À ce point, vous avez normalement un certain nombre de fichiers qui se sont créés dans votre répertoire.
ted@kali:/home/ted/dev/hugo-demo# ls -l
total 0
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 archetypes
drwxrwxrwx 1 ted ted 512 Dec 22 19:23 aws
-rwxrwxrwx 1 ted ted 123 Dec 22 17:34 config.toml
drwxrwxrwx 1 ted ted 512 Dec 22 17:18 content
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 data
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 layouts
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 public
-rwxrwxrwx 1 ted ted 11 Dec 22 19:11 README.md
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 resources
drwxrwxrwx 1 ted ted 512 Dec 22 17:17 static
drwxrwxrwx 1 ted ted 512 Dec 22 19:47 themesÀ noter qu'Hugo est un moteur, il vient nativement sans aucun theming.
Nous allons donc en ajouter un. Pour cette démo, j'ai choisi un thème très basique, listed, disponible sur Github.
De nombreux autres thèmes sont disponibles via des sites tiers comme Jamstack par exemple :
Jamstack ThemesDonc, nous allons cloner notre thème, puis l'activer :
git submodule add https://github.com/ronv/listed.git themes/listed
echo theme = \"listed\" >> config.tomlEnsuite, je vous invite à modifier le fichier config.toml à la racine pour renseigner les informations qui vous correspondent (notamment l'URL racine du site).
À titre d'exemple voici le mien :
baseURL = "https://demo-hugo.tferdinand.net/"
languageCode = "fr-FR"
title = "Hugo Demo - TFerdinand.net"
theme = "listed"Si l'on fait un blog, c'est pour avoir du contenu. Nous allons donc de suite créer un premier billet avec une simple commande :
hugo new posts/my-first-post.mdAvec cette commande, nous indiquons que nous allons créer un post qui s'appellera "my-first-post".
Vous noterez l'extension : Hugo fonctionne avec des posts écrits en markdown. Si vous n'êtes pas à l'aise avec ce templating, il existe de nombreuse "cheat sheet" pour vous aider, comme :
Markdown GuideEnsuite, vous pouvez éditer votre post, qui se trouvera dans ./content/posts/my-first-post.md
Voici par exemple les informations que j'y ai mises.
À noter que le premier bloc entre les tirets en haut correspond aux métadatas de votre billet.
Avant de fermer votre éditeur, n'oublier pas de changer la variable draft de true à false, sans quoi votre billet ne sera pas publié.
---
title: "My First Post"
date: 2021-12-22T17:23:34+01:00
draft: false
toc: false
images:
tags:
- untagged
---
Hello friend!
As you can see, we use **markdown** to create a simple blog
```python
#!/usr/bin/env python3
# We can use every markdown blocks
works = True
if works:
print "You're the best!"
```Vous pouvez tester le rendu en lançant la commande suivante :
hugo server -Dqui devrait vous donner le résultat suivant :
ted@kali:/home/ted/dev/hugo-demo# hugo server -D
| EN
+------------------+----+
Pages | 12
Paginator pages | 0
Non-page files | 0
Static files | 3
Processed images | 0
Aliases | 4
Sitemaps | 1
Cleaned | 0
Total in 75 ms
Watching for changes in /mnt/d/dev/hugo-demo/{content,data,layouts,static,themes}
Watching for config changes in /mnt/d/dev/hugo-demo/config.toml, /mnt/d/dev/hugo-demo/themes/listed/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
À partir de là, vous pouvez vous rendre sur http://127.0.0.1:1313 pour voir votre blog tourner.
Maintenant, c'est bien joli, mais vous n'allez pas faire se connecter les utilisateurs sur votre PC!
Dans les deux premiers billets, nous avons vu comment créer notre bucket qui servira notre site, ainsi que le domaine associé, puis nous avons commencé à manipuler Hugo.
Dans le billet final, nous mettrons en place le nécessaire pour automatiser le déploiement et avoir un blog en haute disponibilité, automatisé, sauvegardé à moindre coût.
Rendez-vous pour le grand final!
Héberger un blog ne demande pas forcément une énorme infrastructure et beaucoup de moyens. Il est possible de créer un blog simplement pour quelques euros par an (et encore).
Il y a quelques mois, j'avais écrit un billet indiquant l'importance de publier son contenu "chez soi", que vous pouvez retrouver ci-dessous.
TFerdinand.netTeddy FERDINANDSuite à ce dernier, beaucoup m'ont contacté pour me demander des exemples concrets de ce que j'entendais par là.
Aujourd'hui, je vais donc vous présenter un modèle, que vous pouvez facilement modifier ou faire évoluer pour héberger votre contenu à moindre coût. Tout en prenant en compte la haute disponibilité, les sauvegardes et le déploiement.
Je vais partir sur une cible assez simple.
Je veux pouvoir éditer mon blog depuis mon PC, pousser le code sur Github, et qu'il soit publier en quelques minutes.
De manière très synthétique, voici la cible.
Le seul prérequis est d'avoir un nom de domaine (et on peut s'en passer si on le souhaite).
Certains domaines ne coûtent presque rien, par exemple le ".ovh" ne coute que 3€ HT par an!
Hugo est un moteur de création de sites, open source, générant des fichiers statiques. L'intérêt premier est de ne pas nécessiter de compilation à la volée comme avec des langages interprétés (Php, Node, Python, etc.), et il n'a donc pas besoin de base de données.
Dans le cas d'un blog, c'est un modèle adapté, car nous avons du contenu qui n'a pas besoin de bouger énormément au jour le jour.
Pour plus d'information, je vous invite à vous rendre sur le site du projet !
NewsMaintenant que vous avez notre nom de domaine, on va commencer à préparer le socle qui va recevoir notre site.
Pour ce billet, j'ai fait le choix de le faire manuellement, mais libre à vous de l'automatiser si vous le souhaitez!
À noter que le mode d'hébergement que nous allons utiliser ne sait pas gérer le chiffrement TLS avec votre nom de domaine.
Pour cela il faut soit :
Pour cela, il vous faut ouvrir un compte sur Scaleway. Ce compte est gratuit. Scaleway est un cloud provider d'Illiad. Pas d'inquiétude, une carte bleue vous sera demandée, mais vous n'aurez aucune facture, je peux vous l'attester :
Ensuite, nous allons utiliser la solution de stockage d'objet de Scaleway.
Pourquoi cette solution?
À noter qu'un stockage d'objet est prévu pour stocker des fichiers statiques, qui peuvent être téléchargés directement. Nous ne pouvons pas manipuler les fichiers en direct comme sur un disque dur.
Nous allons donc cliquer sur "Object storage" dans le menu "Stockage" du menu latéral gauche. Ensuite, nous allons cliquer sur le "+" en haut à droite pour créer un nouveau bucket.
Vous devriez arriver sur un masque similaire à celui-ci :
Dans mon cas, vous pouvez voir qu'il s'agit de "demo-hugo.tferdinand.net" que j'ai créé pour l'occasion. Vous pouvez choisir la région que vous souhaitez, pour ma part, j'ai pris la France. Pour la visibilité du bucket, vous pouvez laisser en privé, nous reviendrons indirectement dessus par la suite.
Une fois le bucket créé, cliquez sur son nom, puis allez dans l'onglet "Réglages du bucket".
La partie qui nous intéresse ici est le "bucket website". Cette fonctionnalité va nous permettre de créer un serveur web distribuant des fichiers statiques.
Nous allons donc activer la fonctionnalité, et indiquer les paramètres suivants :
index.html404.hmtlVous pouvez ensuite cliquer sur "enregistrer la configuration"
Cloudflare est aussi un service gratuit pour une utilisation non commerciale, car nous n'avons pas forcément besoin de ses fonctionnalités avancées.
Cloudflare est d'ailleurs devant mon serveur, et vous l'utilisez actuellement!
Nous allons donc récupérer le nom de domaine de notre bucket, dont nous aurons besoin.
Ensuite, depuis l'interface de Cloudflare, nous allons créer un record DNS CNAME qui pointera vers ce bucket.
Attention, si on veut avoir du TLS, il faut bien choisir l'option "Proxied" sur Cloudflare, qui permet de surcroit d'exploiter le cache de ce CDN.
Arriver à cette étape, vous pouvez vous rendre sur votre record DNS, et si tout va bien, vous obtiendrez une jolie erreur 404.
Pas d'inquiétude, c'est normal. Actuellement, nous avons un hébergement, mais aucune donnée dessus!
Comme je vous l'ai indiqué en préambule, ce billet est le premier d'une série de trois.
Rendez-vous au prochain billet pour dans lequel nous commencerons à manipuler légèrement Hugo et nous créerons le repository Github qui hébergera notre solution.
