|
| 1 | +<p align="center"> |
| 2 | + <img alt="Logo Modulo" src="https://user-images.githubusercontent.com/12733352/187911585-9ba02dd4-3eda-4102-bbaa-45e15bdb0473.png" width="300" /> |
| 3 | +</p> |
| 4 | +<h1 align="center"> |
| 5 | + Site web |
| 6 | +</h1> |
| 7 | + |
| 8 | +Ce répertoire contient le code source pour le site informationnel Modulo, actuellement accessible sur [https://modulo-info.ch](https://modulo-info.ch/) et hébergé chez Infomaniak. Ce projet, complémentaire aux [ressources Modulo](https://github.com/edunumsec2/book), permet de communiquer plus largement les informations importantes liées à Modulo. |
| 9 | + |
| 10 | +## Technologies |
| 11 | + |
| 12 | +Le site est développé avec le framework JavaScript [Gatsby](https://www.gatsbyjs.com/) (v.4.0), les styles sont gérés par le framework CSS [Tailwind](https://tailwindcss.com/), tous les deux open source. De manière similaire à [Sphinx](https://www.sphinx-doc.org/en/master/) qui génère une documentation statique pour le projet principal, Gatsby génère des fichiers HTML/CSS/JS statiques permettant une très grande portabilité - aucune technologie spécifique n'est requise du côté du serveur. |
| 13 | + |
| 14 | +## 🚀 Installation |
| 15 | + |
| 16 | +1. **Pré-requis** |
| 17 | + |
| 18 | + [**Visual Studio Code**](https://code.visualstudio.com/) ou n'importe quel éditeur de code de votre choix. |
| 19 | + |
| 20 | + [**Node.js**](https://nodejs.org/en/download/) _(v.16.x.x LTS)_ nécessaire pour l'installation de Gatsby, permet à celui-ci de générer les fichiers statiques. Node permet également d'accéder au Node Package Manager (NPM) - outil similaire à pip pour Python. |
| 21 | + |
| 22 | + ```shell |
| 23 | + # pour vérifier si Node est installé |
| 24 | + node --version # expected : v.16.x.x |
| 25 | + ``` |
| 26 | + |
| 27 | + _Si la commande ne fonctionne pas, vous devez peut-être relancer un nouveau Terminal ou redémarrer la machine._ |
| 28 | + |
| 29 | + [**GitHub Desktop**](https://desktop.github.com/) **(recommandé)** pour cloner ce répertoire. GitHub Desktop fournit une interface graphique agréable d'utilisation pour Git, en gardant les choses simples puisqu'il enlève certaines complexités de Git (utilisation d'un agent ssh par exemple). Pour Ubuntu, voir [github_ubuntu_desktop.sh](https://gist.github.com/berkorbay/6feda478a00b0432d13f1fc0a50467f1). |
| 30 | + |
| 31 | + _A la place de GitHub Desktop, vous pouvez aussi utiliser [Git](https://git-scm.com/downloads) via votre terminal, mais il faudra [se familiariser avec les commandes](https://rogerdudler.github.io/git-guide/), [générer une clé SSH](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent) et la [connecter à votre compte GitHub](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/adding-a-new-ssh-key-to-your-github-account) pour pouvoir récupérer le projet._ |
| 32 | + |
| 33 | +2. **Gatsby CLI** |
| 34 | + |
| 35 | + Installer Gatsby Command Line Interface (CLI) via NPM. Gatsby CLI permettra d'exécuter les commandes de développement ou de build (voir [utilisation](#utilisation)). |
| 36 | + |
| 37 | + ```shell |
| 38 | + # install gatsby cli |
| 39 | + npm install -g gatsby-cli |
| 40 | + ``` |
| 41 | + |
| 42 | + ```shell |
| 43 | + # check installation |
| 44 | + gatsby --version # expected : Gatsby CLI version: 4.16.0 |
| 45 | + ``` |
| 46 | + |
| 47 | +_Si vous êtes bloqués dans l'installation de Node, Git ou Gatsby CLI, vous pouvez trouver de l'aide supplémentaire [ici](https://www.gatsbyjs.com/docs/tutorial/part-0/)_. |
| 48 | + |
| 49 | +3. **Cloner le projet** |
| 50 | + |
| 51 | + Via GitHub Desktop. |
| 52 | + |
| 53 | + Ou alors via votre terminal : |
| 54 | + |
| 55 | + ```shell |
| 56 | + |
| 57 | + # aller dans votre répertoire de développement |
| 58 | + cd my-dev-repository |
| 59 | + |
| 60 | + # cloner le projet |
| 61 | + git clone [email protected]:edunumsec2/modulo-website.git |
| 62 | + |
| 63 | + ``` |
| 64 | + |
| 65 | +4. **Installation des dépendances** |
| 66 | + |
| 67 | + A la racine du projet, installer les [dépendances](https://github.com/edunumsec2/modulo-website/blob/master/package.json) : |
| 68 | + |
| 69 | + ```shell |
| 70 | + |
| 71 | + # aller dans le répertoire du projet |
| 72 | + cd modulo-website |
| 73 | + |
| 74 | + # installer les dépendances |
| 75 | + npm install --force |
| 76 | + |
| 77 | + ``` |
| 78 | + |
| 79 | +## Utilisation |
| 80 | + |
| 81 | +todo (gatsby build, clean, develop) |
| 82 | + |
| 83 | +## Structure du projet |
| 84 | + |
| 85 | +todo |
| 86 | + |
| 87 | +## Ressources utiles |
| 88 | + |
| 89 | +todo |
0 commit comments