Copie du readme deu précédent déépôt
This commit is contained in:
@@ -1,14 +1,89 @@
|
||||
# Default starter for Gridsome
|
||||
# TL;DR.
|
||||
```sh
|
||||
sudo npm install --g @gridsome/cli
|
||||
npm install
|
||||
gridsome develop
|
||||
```
|
||||
pour lancer le serveur de développement à l'adresse `http://localhost:8080`
|
||||
# En détail
|
||||
## Installation
|
||||
|
||||
This is the project you get when you run `gridsome create new-project`.
|
||||
#### Cloner le projet
|
||||
Ouvrez un terminal et deplacez vous à l'endroit désiré. *(ex: le bureau)*
|
||||
```sh
|
||||
cd Desktop/
|
||||
git clone https://figureslibres.io/gogs/thibaud_goiffon/popsu_html2print.git
|
||||
```
|
||||
|
||||
### 1. Install Gridsome CLI tool if you don't have
|
||||
#### Rentrer dans le projet
|
||||
Le projet vient d'être cloné dans un dossier sur le bureau, mais le terminal se trouve toujours sur le bureau.
|
||||
Il faut maintenant se déplacer à la racine du projet.
|
||||
```sh
|
||||
cd popsu_html2print/
|
||||
```
|
||||
|
||||
`npm install --global @gridsome/cli`
|
||||
#### Installer les dépendances
|
||||
```sh
|
||||
npm install
|
||||
```
|
||||
Un dossier "node_modules" vient d'être ajouté à votre clone du projet. Il est peuplé par les dependances définits dans le fichier "package.json".
|
||||
|
||||
### 2. Create a Gridsome project
|
||||
#### Installer gridsome
|
||||
L'installation de Gridsome de maniere globale sur votre systeme est nécessaire pour utiliser de nouvelles commandes dans le terminal.
|
||||
```sh
|
||||
sudo npm install --g @gridsome/cli
|
||||
```
|
||||
|
||||
1. `gridsome create my-gridsome-site` to install default starter
|
||||
2. `cd my-gridsome-site` to open the folder
|
||||
3. `gridsome develop` to start a local dev server at `http://localhost:8080`
|
||||
4. Happy coding 🎉🙌
|
||||
#### lancer le serveur
|
||||
```sh
|
||||
gridsome develop
|
||||
```
|
||||
Après un court temps de construction, ce message devrait se présenter.
|
||||
```sh
|
||||
DONE Compiled successfully in 278ms 11:05:45
|
||||
Site running at: http://localhost:8080/
|
||||
Explore GraphQL data at: http://localhost:8080/___explore
|
||||
```
|
||||
Pour visualisez la mise en page, cliquez sur ce lien http://localhost:8080.
|
||||
|
||||
## Fonctionnement
|
||||
1. Les contenus sont rentrés par le client via Strapi
|
||||
2. Gridsome récupère le contenu texte et l'intègre dans le modèle HTML
|
||||
3. Le modèle HTML est habillé avec le css.
|
||||
|
||||
## Utilisation
|
||||
Ouvrir le dossier popsu_html2print dans Atom pour pouvoir faire des modifications dans le CSS.
|
||||
Pour visualisez la mise en page, ouvrez une page web à l'adresse http://localhost:8080
|
||||
##### ⚠️ Important
|
||||
- Ouvrez toujours la page d'aperçu dans Chromium.
|
||||
- Il faut laisser Gridsome tourner dans le terminal, sans ça vous ne pourrez pas afficher l'aperçu sur http://localhost:8080
|
||||
- Rechargez la page pour visionnier les changements après modifications et sauvegarde dans les fichiers css.
|
||||
- Relancez gridsome si des modifications sont apportées dans Strapi
|
||||
- Si le dossier est déjà cloné, Pensez à faire ```git pull``` avant ```gridsome develop```
|
||||
|
||||
```sh
|
||||
CTRL+C
|
||||
gridsome develop
|
||||
```
|
||||
|
||||
## Styles
|
||||
#### Ajouter une police
|
||||
Pour ajouter une nouvelle font, ajouter le fichier dans le dossier src/fonts, puis referencez la dans le fichier css (src/css/fonts.scss)
|
||||
#### Parametres.scss
|
||||
Fichier utilisé pour réferencer des variables globales utilisables dans tout le projet.
|
||||
*Ex: les marges, tailles du document, gouttieres, taille de police.*
|
||||
#### Screen.scss
|
||||
Sert à afficher les pages en vis-à-vis dans le navigateur.
|
||||
|
||||
## Ajouter des modifications
|
||||
```sh
|
||||
git add .
|
||||
```
|
||||
Ajoutez toutes vos modifications.
|
||||
```sh
|
||||
git commit -m "Descriptif de la modification"
|
||||
git push
|
||||
```
|
||||
## Todo
|
||||
|
||||
- Pages citations
|
||||
|
||||
Reference in New Issue
Block a user