Kit de démarrage de base pour sites statiques basés sur Gatsby.js.
Commencez à développer.
Accédez au répertoire de votre nouveau site et démarrez-le.
cd my-site/
gatsby develop
Ouvrez le code source et commencez à éditer !
Votre site fonctionne désormais sur http://localhost:8000
!
Remarque : Vous verrez également un deuxième lien : http://localhost:8000/___graphql
. Il s'agit d'un outil que vous pouvez utiliser pour expérimenter l'interrogation de vos données. Apprenez-en plus sur l’utilisation de cet outil dans le didacticiel Gatsby.
Ouvrez le répertoire my-site
dans l'éditeur de code de votre choix et modifiez src/pages/index.js
. Enregistrez vos modifications et le navigateur se mettra à jour en temps réel !
Un aperçu rapide des fichiers et répertoires de niveau supérieur que vous verrez dans un projet Gatsby.
.
├── node_modules
├── src
├── .gitignore
├── .prettierrc
├── gatsby-browser.js
├── gatsby-config.js
├── gatsby-node.js
├── gatsby-ssr.js
├── LICENSE
├── package-lock.json
├── package.json
├── README.md
└── yarn.lock
/node_modules
: Ce répertoire contient tous les modules de code dont dépend votre projet (packages npm) qui sont automatiquement installés.
/src
: Ce répertoire contiendra tout le code lié à ce que vous verrez sur le front-end de votre site (ce que vous voyez dans le navigateur) comme l'en-tête de votre site ou un modèle de page. src
est une convention pour « code source ».
.gitignore
: ce fichier indique à git les fichiers pour lesquels il ne doit pas suivre/ne pas conserver d'historique des versions.
.prettierrc
: Ceci est un fichier de configuration pour Prettier. Prettier est un outil pour vous aider à maintenir la cohérence du formatage de votre code.
gatsby-browser.js
: Ce fichier est l'endroit où Gatsby s'attend à trouver toute utilisation des API du navigateur Gatsby (le cas échéant). Ceux-ci permettent la personnalisation/extension des paramètres Gatsby par défaut affectant le navigateur.
gatsby-config.js
: Il s'agit du fichier de configuration principal d'un site Gatsby. C'est ici que vous pouvez spécifier des informations sur votre site (métadonnées) comme le titre et la description du site, les plugins Gatsby que vous souhaitez inclure, etc. (Consultez la documentation de configuration pour plus de détails).
gatsby-node.js
: Ce fichier est l'endroit où Gatsby s'attend à trouver toute utilisation des API Gatsby Node (le cas échéant). Ceux-ci permettent la personnalisation/extension des paramètres Gatsby par défaut affectant des éléments du processus de création du site.
gatsby-ssr.js
: Ce fichier est l'endroit où Gatsby s'attend à trouver toute utilisation des API de rendu côté serveur Gatsby (le cas échéant). Ceux-ci permettent de personnaliser les paramètres Gatsby par défaut affectant le rendu côté serveur.
LICENSE
: Gatsby est sous licence MIT.
package-lock.json
(voir package.json
ci-dessous, en premier). Il s'agit d'un fichier généré automatiquement basé sur les versions exactes de vos dépendances npm installées pour votre projet. (Vous ne modifierez pas ce fichier directement).
package.json
: Un fichier manifeste pour les projets Node.js, qui inclut des éléments tels que des métadonnées (le nom du projet, l'auteur, etc.). Ce manifeste permet à npm de savoir quels packages installer pour votre projet.
README.md
: Un fichier texte contenant des informations de référence utiles sur votre projet.
yarn.lock
: Yarn est une alternative au gestionnaire de packages npm. Vous pouvez utiliser soit du fil, soit du npm, bien que tous les documents Gatsby fassent référence à npm. Ce fichier a essentiellement le même objectif que package-lock.json
, uniquement pour un système de gestion de packages différent.
Pour le déploiement, vous pouvez utiliser Gitlab CI. Le projet contient deux fichiers - exemple .gitlab-ci.yml
et pour le déploiement S3 .gitlab-ci-s3.yml
.