Mise à jour du README
This commit is contained in:
parent
c5f79aab69
commit
a32dd910b1
1 changed files with 67 additions and 2 deletions
69
README.md
69
README.md
|
|
@ -2,13 +2,78 @@
|
||||||
|
|
||||||
# Le site web de la distorsion !
|
# Le site web de la distorsion !
|
||||||
|
|
||||||
|
## TODO
|
||||||
|
|
||||||
|
- Réparer la CI. Héberger nos propre runners ?
|
||||||
|
- Documenter l'édition du site à partir de l'interface web du dépot git.
|
||||||
|
Comment rajouter/enlever des évènements à venir ? Comment ajouter un billet
|
||||||
|
de blog ? Comment ajouter une feuille de style ?
|
||||||
|
|
||||||
## Site actuel
|
## Site actuel
|
||||||
|
|
||||||
Le site est super basique : c'est juste des fichiers statiques html, css et js
|
Le site est super basique : c'est juste des fichiers statiques html, css et js
|
||||||
servis depuis un bucket S3, hébergé chez les camarades de
|
servis depuis un bucket S3, hébergé chez les camarades de
|
||||||
[deuxfleurs](https://deuxfleurs.fr).
|
[deuxfleurs](https://deuxfleurs.fr).
|
||||||
|
|
||||||
### Test
|
## Edition
|
||||||
|
|
||||||
|
On choisit volontairement de s'imposer des contraintes techniques assez fortes
|
||||||
|
pour que le site reste le plus simple possible, et puisse servir de support
|
||||||
|
pour comprendre les technologies à la base du Web. On veille collectivement à
|
||||||
|
cette simplicité, ce qui implique le mode de fonctionnement suivant pour les
|
||||||
|
éditions du site :
|
||||||
|
|
||||||
|
- Pour les petites éditions de contenu, typiquement mettre à jour la liste des
|
||||||
|
évènement à venir : push dans la branche `main`.
|
||||||
|
- Pour tout le reste à priori, comme éditer la structure du site (header,
|
||||||
|
footer, CSS) ou ajouter des billets de blog, on fait les modifications dans
|
||||||
|
une branche séparée, et on ouvre une pull request.
|
||||||
|
|
||||||
|
## Choix techniques
|
||||||
|
|
||||||
|
On essaye de documenter ici les choix techniques qui ont fait l'objet de
|
||||||
|
débats, et qui sont peut être pas évidents.
|
||||||
|
|
||||||
|
### 2024/10/25: Gestion du contenu qui se répète
|
||||||
|
|
||||||
|
Les contenus qui se répète sont principalement les éléments `<head>`,
|
||||||
|
`<header>` et `<footer>` qui se retrouvent sur toutes les pages HTML. On a considéré les possibilités suivantes :
|
||||||
|
|
||||||
|
- Utiliser un générateur de site simple.
|
||||||
|
- Utiliser du Server Side Include (SSI) pour charger le serveur web d'ajouter
|
||||||
|
le contenu qui se répète.
|
||||||
|
- Ecrire un petit script bash qui ajoute le contenu commun avec des simples
|
||||||
|
`cat` et `sed`.
|
||||||
|
- Ecrire un petit script JavaScript qui ajoute le contenu commun dynamiquement
|
||||||
|
à toutes les pages.
|
||||||
|
|
||||||
|
Ces solutions ont toutes le désavantage de rendre le site plus "opaque". Les
|
||||||
|
fichiers que l'on voit dans le dépot ne sont plus directement ceux qui sont
|
||||||
|
servis au navigateur, ce qui ajoute une barrière supplémentaire à une personne
|
||||||
|
qui essaye de comprendre le site. Les deux dernières sont une pente glissante
|
||||||
|
vers la réécriture d'un générateur de site maison (ce qui n'est pas forcément
|
||||||
|
mal). Le SSI n'est pas vraiment une option tant que le site est hébergé chez
|
||||||
|
DeuxFleurs, car leur infrastructure ne le supporte pas.
|
||||||
|
|
||||||
|
On a donc décidé de répéter le contenu dans tous les fichiers. Si on écrit bien
|
||||||
|
les parties redondantes, elles ne devraient pas être modifiées très souvent.
|
||||||
|
Quand c'est le cas, on peut facilement comprendre la tâche à faire, et
|
||||||
|
éventuellement écrire un petit script bash simple pour réaliser cette tâche.
|
||||||
|
C'est l'occasion d'apprendre quelque chose ensemble.
|
||||||
|
|
||||||
|
Evidemment, c'est pas idéal comme situation. Y'a un risque que les parties qui
|
||||||
|
sont censées être communes finissent par se désynchroniser. On verra bien à
|
||||||
|
l'usage.
|
||||||
|
|
||||||
|
### 2024/10/25: Flex
|
||||||
|
|
||||||
|
Pour centrer le contenu sur toutes les pages dans le css par défaut, on a
|
||||||
|
décidé de transformer le `<body>` en un conteneur flex. Flex c'est un peu
|
||||||
|
compliqué (nous même on comprend pas bien comment ça marche) mais ça permet que
|
||||||
|
tous les nouveaux éléments ajoutés dans la page comme enfant du `<body>` soient
|
||||||
|
centrés, sans qu'il ne faille ajouter `margin: auto` dessus à chaque fois.
|
||||||
|
|
||||||
|
## Tester le site en local
|
||||||
|
|
||||||
Pour tester le site en local, il faut un serveur web local. L'une des options
|
Pour tester le site en local, il faut un serveur web local. L'une des options
|
||||||
les plus simples qui ne demande pas de configuration est d'utiliser celui qui
|
les plus simples qui ne demande pas de configuration est d'utiliser celui qui
|
||||||
|
|
@ -25,7 +90,7 @@ site, simplement ouvrir les fichiers html avec le navigateur va casser des
|
||||||
références (aux fichiers css par exemple, ou des liens). On a besoin de passer
|
références (aux fichiers css par exemple, ou des liens). On a besoin de passer
|
||||||
par un serveur web pour que le site ait une racine bien définie.
|
par un serveur web pour que le site ait une racine bien définie.
|
||||||
|
|
||||||
### Déploiement
|
## Déploiement
|
||||||
|
|
||||||
Si l'informatique marchait bien, le site serait automatiquement mis à jour à
|
Si l'informatique marchait bien, le site serait automatiquement mis à jour à
|
||||||
chaque fois qu'on pousse des modification dans le dépot par l'outil
|
chaque fois qu'on pousse des modification dans le dépot par l'outil
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue