Gatsby construit votre site sous forme de fichiers simples dans public/ : du HTML pour chaque page, plus le JavaScript qui rend la navigation rapide. Depuis la fermeture de Gatsby Cloud en 2023, beaucoup de sites Gatsby ont dû trouver un nouvel hébergement. Lobsite héberge le dossier buildé : lancez gatsby build, puis npx lobsite, et le site est en ligne à une adresse *.lobsite.app en HTTPS.
Comment ça marche
- Buildez le site avec
npx gatsby build(ounpm run build). Gatsby l’écrit danspublic/. - Lancez
npx lobsitedans le projet. Il trouvepublic/et le déploie ; dans un projet Gatsby, c’est la sortie du build, alors que vos propres fichiers statiques sont dansstatic/. Le premier déploiement ne demande pas de compte et dure 6 heures. - Gardez-le grâce au lien de récupération, dans un compte gratuit. Ensuite, les deux mêmes commandes mettent à jour la même adresse.
Réglages de gatsby-config
// gatsby-config.js
module.exports = {
siteMetadata: { siteUrl: "https://my-site.lobsite.app" },
};
siteMetadata.siteUrlest votre adresse complète.gatsby-plugin-sitemap, les liens canoniques et les flux la lisent.pathPrefixn’est pas nécessaire : le site est servi depuis la racine de son adresse. Si vous l’avez défini pour GitHub Pages, buildez sans--prefix-paths.gatsby cleanvide le cache etpublic/. Lancez-le si un déploiement affiche des pages que vous avez supprimées.
Ce qui demande les fonctionnalités serveur de Gatsby
Les pages statiques, gatsby-plugin-image et les données GraphQL fonctionnent toutes, car elles sont résolues pendant gatsby build. Trois fonctionnalités exigent un serveur et ne tournent pas sur Lobsite : les Gatsby Functions (src/api), le rendu serveur avec getServerData et la Deferred Static Generation. Remplacez une fonction qui traite un formulaire de contact par un formulaire qui envoie vers /_lobsite/forms/contact ; voir formulaires. Les redirections créées avec createRedirect demandent un plugin d’hébergeur ; sur Lobsite, mettez-les plutôt dans lobsite.toml, avec le Générateur de redirections.
Les fichiers sont stockés selon leur hash. Redéployer un site inchangé envoie 0 octet.
Prévisualisez avant la mise en ligne. Revenez en arrière en un clic, redirections comprises.
Chaque site reçoit une adresse *.lobsite.app en HTTPS dès le premier déploiement.
Faites pointer un formulaire vers /_lobsite/forms/contact. Filtrage du spam inclus.
Redirections, en-têtes et formulaires vivent dans lobsite.toml et accompagnent chaque déploiement.
Un déploiement sans compte reste en ligne 6 heures. Le lien de récupération le conserve, gratuitement.
Hébergeurs Gatsby comparés
| Lobsite | Netlify | GitHub Pages | |
|---|---|---|---|
| Sites Gatsby statiques | Oui | Oui | Oui |
| Functions, SSR, DSG | Non | Oui | Non |
| Build sur le serveur | Non : vous déployez public/ |
Oui | Dans GitHub Actions |
| Envoi des seuls fichiers modifiés | Oui | Oui | Via Git |
| Compte avant le premier déploiement | Non : en ligne 6 heures, puis à garder gratuitement | Oui | Oui, et un dépôt |
| Formulaires sans backend | Oui, une fois le site dans un compte | Oui | Non |
| Domaine personnalisé | Oui, gratuit | Oui | Oui |
Netlify, qui a repris Gatsby en 2023, exécute aussi ses fonctionnalités serveur. Pour un site Gatsby statique, comme la plupart, Lobsite déploie le dossier buildé en une commande, et grâce aux noms de fichiers hachés de Gatsby, un rebuild n’envoie que les fichiers réellement modifiés.
Questions fréquentes
Où héberger un site Gatsby maintenant que Gatsby Cloud a fermé ?
N’importe quel hébergeur statique sert un site Gatsby buildé. Sur Lobsite, lancez gatsby build et npx lobsite ; le premier déploiement ne demande pas de compte.
Pourquoi npx lobsite déploie-t-il public/ pour Gatsby ?
Parce que Gatsby écrit le site buildé dans public/. Vos propres fichiers à copier, comme favicon.ico, vont dans static/, et Gatsby les copie dans public/ pendant le build.
gatsby-plugin-image fonctionne-t-il sur un hébergeur statique ?
Oui. Les images sont redimensionnées pendant gatsby build et écrites dans public/ : au moment du déploiement, ce sont des fichiers simples.
Ma page 404 Gatsby fonctionnera-t-elle ?
Oui. src/pages/404.js produit 404.html, et Lobsite le sert avec un statut 404 pour toute adresse qui n’existe pas.